It is for the parent element. Call like this
$('ul').cycle();
Fiddle here
سؤال
I'm trying to cycle images as background image and it's not working.
I know how to make that slider with img tag inside the li tag but it must stay on that format as background image
The Html:
<ul>
<li id="img1"></li>
<li id="img2"></li>
<li id="img3"></li>
<li id="img4"></li>
</ul>
<script src="http://malsup.github.com/jquery.cycle.all.js"></script>
<script src="http://malsup.github.com/jquery.easing.1.3.js"></script>
<script>$('li').cycle();</script>
the CSS :
* {
margin: 0;
padding: 0;
list-style: none;
}
li {
background-repeat: no-repeat;
border: 1px black solid;
height: 100px;
left: 0;
position: absolute;
top: 0;
width: 100px;
z-index: 1;
}
#img1 {
background-image : url('http://www.lyricsmode.com/i/upictures/205882.gif');
}
#img2 {
background-image : url('http://media.merchantcircle.com/20649169/Husky-Logo-100x100_full.gif');
}
#img3 {
background-image : url('http://www.wolfontheloose.com/assets/images/BioHazard_100x100_.jpg');
}
#img4 {
background-image : url('http://avatarmaker.net/free-avatars/avatars/games_225/worms_261/worms_firearms_avatar_100x100_69290.jpg');
}
the jsFiddle:
المحلول