I have an array of background images that I would like to cycle through as a simple fade effect. This is easily done with the image html tag but i need them to be background images set as a style. The background images are dynamically pulled through using a cms.
Here is the link so you can see what I'm dealing with on the homepage (the current image is just a background image set in css n the page-top div):
This effect can be easily achieved by Cycle jquery plugin:
an example:
HTML:
<div class="pics">
<img src="images/image1.jpg" width="normal height" height="normal height" />
<img src="images/image2.jpg" width="normal height" height="normal height" />
<img src="images/image3.jpg" width="normal height" height="normal height" />
</div>
JS:
$(".pics").cycle({
,options,
});
you should set your pics div
width and height the same as the width and height of the page and with hidden overflow to prevent image being overflown.
here is a sample:h ttp://bazar-restaurant.somee.com
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.