Jquery 图片滑块如何自动播放
Jquery image slider how to auto play
我想从我的滑块 jquery 部分添加自动播放。我能做什么?
我有一个下一个和一个上一个按钮,但我想添加一个自动播放以及当鼠标悬停在自动停止滑动的图像上时
<script type="text/javascript">
$(document).ready(function () {
$('.photo_category').showFeatureText();
$(".thumbs a").click(function () {
var imgpath = $(this).attr("href");
var imgalt = $(this).attr("alt");
$("#placeholder").attr({
src: imgpath,
alt: imgalt
});
return false;
});
});
$.fn.showFeatureText = function () {
return this.each(function () {
var box = $(this);
var text = $('span', this);
text.css({
display: 'block',
position: 'absolute',
top: '0',
left: '0'
}).hide();
box.hover(function () {
text.slideDown("fast");
}, function () {
text.slideUp("fast");
});
});`enter code here`
}
</script>
将 setInterval 用于自动播放和悬停在图像上时:
$(document).ready(function(){
_interval = setInterval("changeSlides", 4000); //Start autoplay
$('image').hover(function(){
clearInterval(_interval); //Stop the autoplay
}, function(){
_interval = setInterval("changeSlides", 4000); //Start autoplay
});
});
function changeSlides(){
//Change slides
}
我想从我的滑块 jquery 部分添加自动播放。我能做什么? 我有一个下一个和一个上一个按钮,但我想添加一个自动播放以及当鼠标悬停在自动停止滑动的图像上时
<script type="text/javascript">
$(document).ready(function () {
$('.photo_category').showFeatureText();
$(".thumbs a").click(function () {
var imgpath = $(this).attr("href");
var imgalt = $(this).attr("alt");
$("#placeholder").attr({
src: imgpath,
alt: imgalt
});
return false;
});
});
$.fn.showFeatureText = function () {
return this.each(function () {
var box = $(this);
var text = $('span', this);
text.css({
display: 'block',
position: 'absolute',
top: '0',
left: '0'
}).hide();
box.hover(function () {
text.slideDown("fast");
}, function () {
text.slideUp("fast");
});
});`enter code here`
}
</script>
将 setInterval 用于自动播放和悬停在图像上时:
$(document).ready(function(){
_interval = setInterval("changeSlides", 4000); //Start autoplay
$('image').hover(function(){
clearInterval(_interval); //Stop the autoplay
}, function(){
_interval = setInterval("changeSlides", 4000); //Start autoplay
});
});
function changeSlides(){
//Change slides
}