lgt
lgt

Reputation: 1034

load dynamically jquery

I'm using the following script to load jquery in the head in case if is not already loaded.

<script type="text/javascript">
if(!window.jQuery)
{
   var script = document.createElement('script');
   script.type = "text/javascript";
   script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js";
   document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
<script type="text/javascript">


$(document).ready(function() {
        $("#nav li:has(ul)").hover(function(){
            $(this).find("ul").slideDown();
        }, function(){
            $(this).find("ul").hide();
        });
    });
</script>

<style>
#nav {position: fixed; white-space:nowrap;}
#nav ul{ list-style-type:none; margin:0; padding:0; }
#nav li { float:left; padding:0; margin:0;list-style: none;}
#nav li a { width:220px; display:block; text-align:center; color:#000; margin-right:5px; height:35px; line-height:35px; text-decoration:none; font-size:90%; border:1px solid #ccc;text-transform: uppercase;font-weight: bold; }
#nav li a:hover { color:#f00; }
#nav ul ul { display:none; position:absolute; z-index:999; }
#nav li li { float:none; }
#nav li li a { background:#EBE7E6!important; text-align:left; height:auto; line-height:1; width:auto; padding:8px 20px 8px 22px; border:1px solid #D0D0D0; border-top:none; margin-right:0;width: 178px; }
* html li li { display:inline; } /* IE6 Bugfix... */
</style>

but it doesn't appear in the head.

Upvotes: 0

Views: 104

Answers (1)

Derek Hunziker
Derek Hunziker

Reputation: 13141

Based on your comment '$ is not defined' this would indicate that your jQuery fallback is loading too late in the process. As SLaks pointed out, your fallback runs asynchronously.

Try inserting the script block in the head with a document.write(). This will force the browser to evaluate the script before any execution can continue.

<script type="text/javascript">
    if (typeof (jQuery) === 'undefined') {
        document.write(unescape("%3Cscript src='//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));
    }
</script>

Upvotes: 3

Related Questions