سؤال

I have a login box that fades in over a big image slider. I want to prevent the image slider links from being clicked when the login box is open (so they can click anywhere on it to close the login box).

Below is my code, but it does not work and clicking the slider still activates the link.

$('#my-raveis-login').click(function() {
    if ($('#login-box').is(':hidden')){
        $('#login-box').fadeIn('normal');
        $('#login-box').find('.login-toparrow').fadeIn('normal');
    }
    else{
        $('a.featured').click( function() {
            e.preventDefault();
        });
        $('#login-box').fadeOut('normal');
        $('#login-box').find('.login-toparrow').fadeOut('normal');
    }
    return false
});

Any ideas?

هل كانت مفيدة؟

المحلول

Was able to answer my own question. Here is my working code.

//Login Toggle
$('#my-raveis-login').click(function() {
    if ($('#login-box').is(':hidden')){
        $('#login-box').fadeIn('normal');
        $('#login-box').find('.login-toparrow').fadeIn('normal');
    }
    else{
        $('#login-box').fadeOut('normal');
        $('#login-box').find('.login-toparrow').fadeOut('normal');
    }
    return false
});
//Prevent slider if login is open
$('#home-slider a.featured').click(function(e) {
    if ($('#login-box').is(':visible')){
        e.preventDefault();
        $('#login-box').fadeOut('normal');
        $('#login-box').find('.login-toparrow').fadeOut('normal');
    } 
});

It kind of duplicates some of the code for hiding the login, but it definitely works. Feel free to post if you have a cleaner way of doing this.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top