滑动后激活链接解锁... jquery

时间:2012-01-26 01:59:50

标签: jquery hyperlink slider

我有一个jquery插件,我正在为一个网站工作,我有一个快速的问题...这是一个“幻灯片解锁”插件,看起来就像iPhone ...我想知道如何允许人们滑动解锁按钮,然后在完成幻灯片后转发到链接...这是我正在使用的源代码:

$(function() {

$("#slider").draggable({
    axis: 'x',
    containment: 'parent',
    drag: function(event, ui) {
        if (ui.position.left > 550) {
            $("#well").fadeOut();
        } else {
            // Apparently Safari isn't allowing partial opacity on text with background clip? Not sure.
            // $("h2 span").css("opacity", 100 - (ui.position.left / 5))
        }
    },
    stop: function(event, ui) {
        if (ui.position.left < 551) {
            $(this).animate({
                left: 0
            })
        }
    }
});

$('#slider')[0].addEventListener('touchmove', function(event) {
    event.preventDefault();
    var el = event.target;
    var touch = event.touches[0];
    curX = touch.pageX - this.offsetLeft - 73;
    if(curX <= 0) return;
    if(curX > 550){
        $('#well').fadeOut();
    }
    el.style.webkitTransform = 'translateX(' + curX + 'px)'; 
}, false);

$('#slider')[0].addEventListener('touchend', function(event) {  
    this.style.webkitTransition = '-webkit-transform 0.3s ease-in';
    this.addEventListener( 'webkitTransitionEnd', function( event ) { this.style.webkitTransition = 'none'; }, false );
    this.style.webkitTransform = 'translateX(0px)';
}, false);

});

事先感谢您的帮助,我不是一个javascript专家,但我认为它需要在$("#well").fadeOut();之后?

1 个答案:

答案 0 :(得分:1)

你说你有一个链接 - 假设你这样做:

$("#well").fadeOut('fast',function(){
    window.location = $('#myLink').attr('href');
});

如果您只想重定向到网址:

$("#well").fadeOut('fast',function(){
    window.location = 'http://www.foobar.com';
});