cookies code help needed (html,css,js)

by 6 replies
8
Hi Guys,

I'm getting crazy over this script. It's not working. Can anyone give me a tip how to fix it?

my codes are following:
inside the <body> tag in my html:

HTML Code:
<div class="cookie-message">
	<p class="cookie-content">This website uses cookies. By Browsing this website you acconsent to the use of cookies. </p>
	<p class="cookie-content"><button class="button">OK</button> &nbsp; <a href="http://here-goes-my-cookie-page.com">Read more about cookies</a></p>	
</div>
my css file is following (it's more for styling):
Code:
.cookie-message {
      width: 100%;
  	  background: #333;
  	  color: #ddd;
	  padding: 1em 1em .5em;
	  position: fixed;
	  left: -5px;
	  bottom: 2em;
	  text-align: left;
	  z-index: 1;
	  }
and my "java" is following:
Code:
<!--Start Cookie Script--> 
<script>
$('.cookie-header').click(function() {
  		$('.cookie-content').slideToggle('fast');
		  $('.cookie-content button').click(function() {
			    $('.cookie-content').slideUp('fast');
		  });
	});
	</script>
	 <!--End Cookie Script-->
in fact I'm completely new to java so I copied it and inserted it before the </body> tag and obviously it is not working...

can someone help me? I need the message to close when pressing the "ok" button...
#programming #code #cookies #css #html #needed
  • Hi.

    You can try to replace the mentioned script code with this:
    Code:
    <!--Start Cookie Script--> 
<script>
    $('.cookie-header').click(function () {
        $('.cookie-content').slideToggle('fast');
    });
    $('.cookie-content button').click(function () {
        $('.cookie-content').slideUp('fast');
    });
</script>
<!--End Cookie Script-->
    • [ 1 ] Thanks
    • [1] reply
    • Hi. You should also load Jquery lib:


      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
      • [ 1 ] Thanks
      • [1] reply
  • thanks guys,

    I've done as you told so, but it's not working... (??)
    I inserted as following:
    1. the "cookie message" at the very beginning of my <body> tag. (then goes my entire site html code)
    2. the Jquery lib link just before the "cookie script", (my website html code is placed before this link).
    3. "the cookie script" at the end of html, just before the </body> tag.

    Is that correct? I am a beginner with java...
  • Arcsn,

    Can you post or PM a link to your page?
  • Try this code:

    <html>
    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
    $('.cookie-header').click(function() {
    $('.cookie-content').slideToggle('fast');
    $('.cookie-content button').click(function() {
    $('.cookie-content').slideUp('fast');
    });
    });
    });
    </script>

    <style>
    .cookie-message {
    width: 100%;
    background: #333;
    color: #ddd;
    padding: 1em 1em .5em;
    position: fixed;
    left: -5px;
    bottom: 2em;
    text-align: left;
    z-index: 1;
    }
    </style>
    </head>
    <body>
    <div class="cookie-header">
    <div class="cookie-message">
    <p class="cookie-content">This website uses cookies. By Browsing this website you acconsent to the use of cookies. </p>
    <p class="cookie-content"><button class="button">OK</button> &nbsp; <a href="http://here-goes-my-cookie-page.com">Read more about cookies</a></p>
    </div>
    </div>
    </body>
    </html>

    Sample: http://wordpress-expert.net/demo/php...d-html-css-js/
Join the discussion

Next Topics on Trending Feed