"First, solve the problem.
Then, write the code."
John Johnson
WebDev

ImgChain - jQuery plugin

http://demo.mbialkowski.info/jquery-imgchain

SmartImage 1.4 - Yii Framework Extension
Kozienalia 2011 - XX Lubelskie Dni Kultury Studenckiej
zamknięty:
czerwiec 2011
zleceniodawca:
projekt autorski
Opis:

imgChain jest to plugin jQuery, za pomocą którego w prosty sposób można powiązać bloki elementów, które powinny cyklicznie zmieniać swoją zawartość.

Przykładowy kod HTML:

<style>
	.container {
		width:200px;
		height:194px;
		display:block;
		overflow:hidden;
		float:left;
		margin:10px;
	}
</style>

<div id="mainChange">
        <div class="container">
            <img src="http://www.8notes.com/wiki/images/200px-AvrilLavigne_UnderMySkin.jpg"/>
            <img src="http://davidnaylor.org/temp/firefox-logo-200x200.png"/>
            <img src="http://upload.wikimedia.org/wikipedia/en/thumb/9/9b/Robert_Johnson_-_The_Complete_Recordings.jpg/200px-Robert_Johnson_-_The_Complete_Recordings.jpg"/>
            <img src="http://www.etiudafilozoficzna.pl/Tematy/kalendarium/200px-Meinong.jpg"/>
        </div>
        
        <div class="container">
            <img src="http://www.8notes.com/wiki/images/200px-AvrilLavigne_UnderMySkin.jpg"/>
            <img src="http://davidnaylor.org/temp/firefox-logo-200x200.png"/>
            <img src="http://upload.wikimedia.org/wikipedia/en/thumb/9/9b/Robert_Johnson_-_The_Complete_Recordings.jpg/200px-Robert_Johnson_-_The_Complete_Recordings.jpg"/>
            <img src="http://www.etiudafilozoficzna.pl/Tematy/kalendarium/200px-Meinong.jpg"/>
        </div>
</div>

Uruchomienie pluginu:

<script src="./jquery-imgchain.min.js"></script>
    <script>
    $(document).ready(
        function(){
            $('#mainChange').imgChain({'timeout': '1000'});
        }
    );
</script>

Zobacz stronę demo pod adresem: http://demo.mbialkowski.info/jquery-imgchain/

do góry