CODEWITHSUNDEEP
javascriptjqueryhtml
MissCoder87
MissCoder87

Reputation: 2669

jQuery change on click even to on load event

I've got the following code which I've put together, and I need to change it from the onclick event to onload, so it loads the modal window automatically when the page is loaded. However, for the life of me I can't work out how do it, i've tried many a permutation it just doesn't seem to work!

$(document).ready(function() {  
    $('a.poplight[href^=#]').click(function() {
        var popID = $(this).attr('rel'); 
        var popURL = $(this).attr('href'); 
        var query = popURL.split('?');
        var dim = query[1].split('&');
        var popWidth = dim[0].split('=')[1]; 

        $('#' + popID)
            .fadeIn()
            .css({ 'width': Number( popWidth ) })
            .prepend('<a href="#" class="close"><img src="close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a>');

        var popMargTop = ($('#' + popID).height() + 80) / 2;
        var popMargLeft = ($('#' + popID).width() + 80) / 2;

        $('#' + popID).css({
            'margin-top' : -popMargTop,
            'margin-left' : -popMargLeft
        });

        $('body').append('<div id="fade"></div>'); 
        $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); 

        return false;
    });

    $('a.close, #fade').live('click', function() { 
        $('#fade , .popup_block').fadeOut(function() {
            $('#fade, a.close').remove(); 
        });
        return false;
    });
});

This loads it at the moment:

<a href="#?w=200" rel="popup_name" class="poplight">Popup</a>

Any help will be really appreciated, thanks

Upvotes: 0

Views: 578

Answers (3)

Leon
Leon

Reputation: 4532

If I understood you correctly, you could try this:

$(document).ready(function() {

    $this = $('a.poplight[href^=#]');
    var popID = $this.attr('rel'); 
....

Upvotes: 0

Rory McCrossan
Rory McCrossan

Reputation: 337560

If you look up the documentation for the plugin you can move the logic for the popup into it's own function (called popOpen() in the example) and call that on load like this:

$('a.poplight[href=#?w=200]').popOpen();

Upvotes: 2

Anil
Anil

Reputation: 21910

Try:

$('a.poplight[href^=#]').trigger("click");

Or:

$('a.poplight[href^=#]').click();

These should be in your DOM Ready.

Upvotes: 0

Related Questions