0

I've got the following code working on a static page, but it does not work with EE. Could anyone tell me why?

CSS

.contentB {display: none;}

HTML

<div class="contentA">  
   <h1>Sign up to download (set cookie)</h1>
   <button class="clickme">ClickMe</button>
</div>

<div class="contentB">  
   <h1>Download (cookie set)</h1>
</div>

JS

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>
<script type="text/javascript">
$(document).ready(function () {
        $(".clickme").on('click',function() {
            $.cookie('showContent', 'true', { expires: 7, path: '/' });
          });

 }); 

$ (function (){
    if ($.cookie('showContent') == 'true') {
        $( ".contentB" ).show();
        $( ".contentA" ).hide();
    }
});
 </script>  

Basically I want to show contentB and hide contentA if the cookie is present.

2
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>

This is likely your problem - you're calling your scripts in a relative fashion, but your URL likely has multiple segments, so the browser is looking for the scripts in the wrong place. Change these to absolute references:

<script type="text/javascript" src="/jquery.js"></script>
<script type="text/javascript" src="/jquery.cookie.js"></script>
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.