Reafidy
Reafidy

Reputation: 8431

Run Multiple Scripts after Page Loads

I have the following javascripts:

<script type="text/javascript">
        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });
</script>

And:

<script type="text/javascript">window.onload = function () {
document.getElementById('Features').style.visibility = 'Visible';
};</script>

I would like to combine the first script into the onload function of the second script. So that both scripts run once the page is loaded.

Upvotes: 0

Views: 1071

Answers (2)

Christopher Marshall
Christopher Marshall

Reputation: 10736

This will run once the DOM has been loaded. http://api.jquery.com/ready/

$(document).ready(function() {

        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });

        document.getElementById('Features').style.visibility = 'Visible';

});

or the short hand for .ready()

$(function() {

            $('#HomeSlideShow ul.images').jSlideshow({
                auto: true,
                delay: 15,
                indicators: '#HomeSlideShow ul.indicators'
            });

            document.getElementById('Features').style.visibility = 'Visible';

});

Upvotes: 5

ChrisF
ChrisF

Reputation: 180

<script type="text/javascript">
    $(function() {
        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });

        $('#Features').css({ visibility: 'Visible' });
    });
</script>

Use jQuery to add as many things to run on page load as you like. It could just as easily be done like this:

<script type="text/javascript">
    $(function() {
        $('#HomeSlideShow ul.images').jSlideshow({
            auto: true,
            delay: 15,
            indicators: '#HomeSlideShow ul.indicators'
        });
    });
</script>

...

<script type="text/javascript">
    $(function() {
        $('#Features').css({ visibility: 'Visible' });
    });
</script>

Upvotes: 1

Related Questions