javascriptjqueryaddthisdomready

Delay execution of addThis


I have a website that uses google maps plus my own javascript. I am using the addThis javascript for social buttons. The site isnt really usable until my javascript plus the google javascript loads and runs (on $(document).ready...) so I want to minimise delay in getting things going. So I was looking at postponing the AddThis module until everything else has finished as its not that important.

Other question on stackoverflow suggest placing the link to the javascript that I want to delay at the bottom of the page. But am i right in thinking this is not relevant to me as $(document).ready... will not fire until all linked javascript has loaded no matter where its placed?

If so, should I somehow load in the addThis javascript after on $(document).ready... ?

Though I'd really prefer not to run addThis until all google maps images etc are all loaded (I believe .ready() does not wait for this). Is there a recomended way to handle this kind of thing?

For reference, typical addThis usage...

<script type="text/javascript">
    var addthis_config = {
        "data_track_addressbar":false,
        "ui_click":true,
        "data_use_cookies": false
    };
</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#"></script>

<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_compact" title="Share"></a>
</div>

Solution

  • I came up with this (please let me know if there is a better way).

    <script type="text/javascript">
        var addthis_config = {
            "data_track_addressbar":false,
            "ui_click":true,
            "data_use_cookies": false
        };
    
        $(window).on("load", function(){
            $('head')
                .append($('<script>')
                .attr('type', 'text/javascript')
                .attr('src', "http://s7.addthis.com/js/250/addthis_widget.js#"));        
        });
    </script>
    
    <div class="addthis_toolbox addthis_default_style addthis_32x32_style">
    <a class="addthis_button_facebook"></a>
    <a class="addthis_button_twitter"></a>
    <a class="addthis_button_preferred_1"></a>
    <a class="addthis_button_preferred_2"></a>
    <a class="addthis_button_compact" title="Share"></a>
    </div>