CODEWITHSUNDEEP
javascriptjqueryhtmlcss
zomboble
zomboble

Reputation: 833

JS files not loading first page load?

When performing a script include on a file (index.shtml), the page doesn't perform the task it should (display a div on the bottom of the page).

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="cookiesJs/jquery.cookie.js"></script>
<script src="cookiesJs/c.js"></script>

I have to reload the page for the script to take effect. How can I load the script first time? Never had this problem before.

Script to appear:

document.write('<style type="text/css">a{text-decoration: none;}#cookieMessage {font-family: Arial, Helvetica, sans-serif;color: #222;background-color: #D1D3D4;padding: 8px;height: auto;position: fixed;width:200px;margin: 0px 0px 0 0;bottom:0px;right:10px;border:#FFF 2px solid;border-bottom:0px;padding: 0px 8px 8px 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-topright: 8px;-webkit-border-top-left-radius: 8px;-webkit-border-top-right-radius: 8px;border-top-right-radius: 8px;border-top-left-radius: 8px;text-align:left;overflow:hidden;z-index:999999;}#cookieMessage h6 {font-size: 14px;text-transform: uppercase;padding: 0px;margin-top: 8px;margin-right: 0px;margin-bottom: 5px;margin-left: 0px;color: #222;}#cookieMessage img {border:0px;}#cookieMessage p {text-align: left;font-size: 11px;padding: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 2px;margin-left: 0px;color: #222;}#cookieMessage p a {color: #333;}#cookieMessage h6 a {color: #333;text-decoration: none;}#arrow{margin-top: -20px;}</style>');
$(document).ready(function(){
    $("#polup").toggle(function(){
        $("#cookieMessage").animate({height:120},500);
        $("#arrow").animate({height:0},160);
    },function(){
        $("#cookieMessage").animate({height:22},500);
        $("#arrow").animate({height:14},160);
    });
});

var accepted = get_cookie("accepted");
if(accepted == null){
    document.cookie = "accepted=no; path=/"; // initialize the cookie
}

function accept(){
    // when the client clicks accept
    $("#cookieMessage").fadeOut();
    $.cookie("accepted", "yes", {
       expires : 360,           //expires in 10 days
       path    : '/',          //The value of the path attribute of the cookie 
    });
}
function get_cookie ( cookie_name )
// method to retrieve a cookie based upon its name entered
    {
      var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' );

      if ( results )
        return ( unescape ( results[2] ) );
      else
        return null;
    }
var x = get_cookie("consentCookie");

        if((x == null) && (accepted == "no")){
        //if the cookie does not exist it is the users first time on the page
        document.cookie = "consentCookie=no; path=/";
        var policy = '<div id="cookieMessage"><h6>Cookie Policy</h6><p>Our website uses cookies. By using our website and agreeing to this policy, you consent to our use of cookies. <a href="cookie_policy.php">Find out more about cookies.</a></p><p><a href="#" onclick="accept();"><img src="cookiesJs/cookieimg/cookie.gif" width="20" height="20" alt="cookie" style="margin-bottom:-5px;" /> I accept</a></p></div>';
        document.write(policy);
    }else if((x == "no") && (accepted == "no")){
        // if they have visited before but not accepted
        document.write('<div id="cookieMessage">');
        var policy = '<a href="#_" id="polup"><h6>Cookie Policy</h6> <img id="arrow" align="right" src="cookiesJs/cookieimg/arrow.gif" width="18" height="14" alt="arrow" /></a></h6>';
        document.write(policy);
        document.write('<p>Our website uses cookies. By using our website and agreeing to this policy, you consent to our use of cookies.</p><p><a href="cookie_policy.php">Find out more about cookies.</a></p><p><a href="#" onclick="accept();"><img src="cookiesJs/cookieimg/cookie.gif" width="20" height="20" alt="cookie" style="margin-bottom:-5px;" /> I accept</a></p></div>');
        $("#cookieMessage").css("height","20");
    }else{
        //if they  have visited and accepted
        document.write('<div id="cookieMessage" style="display: none"><h6>Cookie Policy</h6></div>');
    }

Upvotes: 0

Views: 1797

Answers (1)

Corn&#233; Hogerheijde
Corn&#233; Hogerheijde

Reputation: 238

Is it really the script not being executed? Have you tried with an alert if you get the alert box?

It seems to me your problem could have to do with the fact that on first page load there is no cookie, you set it in your code, but I believe you will be only able to read it next time you load the page. You could check for an cookie, if not present, set the cookie, programmatically reload and run the rest of your code.

Upvotes: 1

Related Questions