我在简介div中有一个带有旋转横幅图像的网站,在页面div中有主页的其余部分。我要执行以下操作:
在完成上一张幻灯片并显示主页的其余部分后,我们如何隐藏包含当前旋转的横幅图像的介绍div。
或者,如果用户单击跳过介绍性文本,那么它还将显示主页。
当前站点:http://new.brandonplanning.com/home
我认为此代码中需要修改
/*-------------Intro page slider starts-----------*/
var intervalID;
function slideSwitch() {
var $active = $('#slideshow IMG.active');
if ($active.length == 0) $active = $('#slideshow IMG:last');
//var $next = $active.next().length ? $active.next()
// : $('#slideshow IMG:first');
var $next;
if ($active.next().length) {
$next = $active.next().delay(3000);
} else {
clearInterval(intervalID);
visibilityCheck();
return;
}
$active.addClass('last-active');
$next.css({ opacity: 0.0 })
.addClass('active')
.animate({ opacity: 1.0 }, 1000, function () {
$active.removeClass('active last-active');
});
}
$(function () {
intervalID = setInterval("slideSwitch()", 6000);
});
/*-------------Intro page slider ends-----------*/
/*-------------Intro page skip starts-----------*/
$(window).load(function () {
$(function () {
visibilityCheck();
$('#loader').remove();
});
$('.skip-intro').click(function () {
visibilityCheck();
});
});
function visibilityCheck() {
$('.hidden').removeClass('hidden');
if ($('#page').is(':hidden')) {
$('#intro').addClass('hidden');
} else {
$('#page').addClass('hidden');
}
}
/*-------------Intro page skip ends-----------*/
提前致谢
最佳答案
基本上,您需要的是:
demo jsBin
$('#slider img:gt(0)').hide();
var T; // timeout
var c = 0; // counter
var imgN = $('#slider img').length; // get the images Number
function toggler(){ // screens toggler function
$('#intro').fadeTo(400,0).siblings('#page').fadeTo(400,1);
}
function a(){ // 'A'nimations
if(c === imgN ){ // if the 'C'ounter reached the images in slider...
toggler(); // toggle our screens
}else{ // else ... do our animations.
$('#slider img').siblings('img').stop().fadeTo(1000,0).eq(c++).stop().fadeTo(1000,1);
} // ^^^^ here the counter 'ticks'
}
function aa(){ // 'A'uto 'A'dvance
T=setTimeout(function(){
a();
aa();
},2000); // set here pause between slides
}
aa();
$('#skip').click(function(){ // if 'skip' is clicked...
clearTimeout(T); // well...
toggler(); // run our screens 'toggler'
});
希望您可以轻松地将此实现到您的页面中。
关于javascript - 在jQuery中完成图像滑块加载后如何重定向页面?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/10531221/