WEB DİZAYN
CSS3 Slide Show
Aslında buna benzer javascriptin ve onun özel ve güzel kütüphanesi jQuery'nin böyle örnekleri mevcut CSS3 ile birlikte buna daha entegre ve daha iyi işler çıkarmamızı sağlayacak. Böylelikle kod ile yapılmış bir uygulama resimlerle yapılan uygulamadan daha hızlı çalışacağı için başka işlemler için bize kaynak sağlamış olacaktır.
Aşağıdaki kodu head kısmına yapıştırınız... Çok fazla ama ne yapalım :)
< link rel="stylesheet" type="text/css" href="css/styles.css" />
Aşağıdaki kodu da body kısmına eklemeniz yeterli olacaktır. Boyutlarını değiştirmek istiyorsanız. CSS dosyasını değiştirmek yeterli olacaktır.
< div id="slideShowContainer">
< div id="slideShow">
< ul>
< li>< img src="img/photos/1.jpg" width="100%" alt="Fish" />< /li>
< li>< img src="img/photos/2.jpg" width="100%" alt="Ancient" />< /li>
< li>< img src="img/photos/3.jpg" width="100%" alt="Industry" />< /li>
< li>< img src="img/photos/4.jpg" width="100%" alt="Rain" />< /li>
< /ul>
< /div>
< a id="previousLink" href="#">»< /a>
< a id="nextLink" href="#">«< /a>
< /div>
< script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">< /script>
< script src="js/jquery.rotate.js">< /script>
< script src="js/script.js">< /script>
