The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Jquery Cookie Problem

3 posters

Go down

Solved Jquery Cookie Problem

Post by ioncube September 18th 2011, 8:28 am

I hav done quite a homework in determining the code to be precise the 'cookie code' such that the browser remember my choice!
Vistt this : https://defencedog.googlecode.com/svn/welcomebox/jquery_welcome_box.html

by viewing the source you will determine the two jquery (essential files) that are needed & I ain't tempering with them.
However I had tried to customise this passage:

Code:
<script type="text/javascript" language="javascript">

$(document).ready(function() {
   $('#sliderBox').slideTo({
      transition:300,
      top:'center',
      left:'center',
      inside:window
   });
   $('#mask').height($(document).height());

   jQuery(window).resize(function() {
      $('#sliderBox').stop().slideTo({
         transition:300,
         top:'center',
         left:'center',
         inside:window
      });
   });

   var closeWelcomeBox;

   $(window).scroll(function(){
      if(!closeWelcomeBox){
         $('#sliderBox').stop().slideTo({
            transition:300,
            top:'center',
            left:'center',
            inside:window
         });
      }
   });

   
   $("#closeWelcomeBox").click(function(){
      $('#sliderBox').stop().slideTo({
         transition:500,
         top:-400
          });
          $('#mask').fadeOut(500);
      closeWelcomeBox = true;
      $.cookie('hidewelcome', 'collapsed');
   });
   
   // COOKIES
    var hidewelcome = $.cookie('hidewelcome');
    if (hidewelcome == 'collapsed') {
        $('#sliderBox').css("display","none");
        $('#mask').css("display","none");
        closeWelcomeBox = true;
    };
});

</script>

First I created a cookie when the button is clicked & giv it its respective property namely 'collapse':
Code:
$.cookie('hidewelcome', 'collapsed');
then I simply wrote this to make browser remember users click event choice (via cookie):
Code:
   // COOKIES
    var hidewelcome = $.cookie('hidewelcome');
    if (hidewelcome == 'collapsed') {
        $('#sliderBox').css("display","none");
        $('#mask').css("display","none");
        closeWelcomeBox = true;
    };

This isn't working or am I missing something bwi
ioncube
ioncube
Forumember

Male Posts : 279
Reputation : 41
Language : eng
Location : Pakistan

http://defencedog.blogspot.com/

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by ioncube September 19th 2011, 8:41 pm

anyone sir; I need it please
ioncube
ioncube
Forumember

Male Posts : 279
Reputation : 41
Language : eng
Location : Pakistan

http://defencedog.blogspot.com/

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by kirk September 19th 2011, 9:26 pm

i dont even understand what it's supposed to do?
or what it has to do with any cookies.


what are you trying to make or get out of it.
it looks simple you can see where you add content to the sliding box, then the other content, what ever it's for?
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Welcome box</title>
<style>

#sliderBox{
   width:200px;
   height:150px;
   background-color:silver;
   position:absolute;
   top:-400px;
   left:-400px;
   z-index:300;
}

#mask{
   position: absolute;
   z-index: 200;
   top: 0px;
   left: 0px;
   width: 100%;
   opacity: .4;
   filter: alpha(opacity=40);
   background-color: #333333;
}

</style>
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="scriptbreaker-slideto-1.0.js"></script>
<script type="text/javascript" language="javascript">

$(document).ready(function() {
   $('#sliderBox').slideTo({
      transition:300,
      top:'center',
      left:'center',
      inside:window
   });
   $('#mask').height($(document).height());

   jQuery(window).resize(function() {
      $('#sliderBox').stop().slideTo({
         transition:300,
         top:'center',
         left:'center',
         inside:window
      });
   });

   var closeWelcomeBox;

   $(window).scroll(function(){
      if(!closeWelcomeBox){
         $('#sliderBox').stop().slideTo({
            transition:300,
            top:'center',
            left:'center',
            inside:window
         });
      }
   });

   
   $("#closeWelcomeBox").click(function(){
      $('#sliderBox').stop().slideTo({
         transition:500,
         top:-400
          });
          $('#mask').fadeOut(500);
      closeWelcomeBox = true;
      $.cookie('hidewelcome', 'collapsed');
   });
   
   // COOKIES
    var hidewelcome = $.cookie('hidewelcome');
    if (hidewelcome == 'collapsed') {
        $('#sliderBox').css("display","none");
        $('#mask').css("display","none");
        closeWelcomeBox = true;
    };
});

</script>
</head>
<body>

</head>

<body>

<div id="mask" ></div>
<div id="sliderBox">
   <center>
   <input type="button" id="closeWelcomeBox" value="Don't show again"/><br /><br />
   JQuery Welcome box.  Uses the scriptbreaker slideTo function.<br />
   
   </center>
</div>

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>


Content goes here
</body>
</html>

 
kirk
kirk
Forumaster

Male Posts : 11037
Reputation : 653
Language : English,Vulcan,Klingon, Romulan,& Gorn

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by ioncube September 19th 2011, 10:06 pm

Am sorry if i can't explain. Let me giv example of profile position toggler. If you toggle position towards either right or left browser remembers your choice. That is you refresh page & profile position remains unaltered.

Now with my page. I am designing a welcome popup!! When a user click 'Don't shoe it again' it must NOT appear after even refreshing page. But this isn't happening at present. Visit my page again ...
ioncube
ioncube
Forumember

Male Posts : 279
Reputation : 41
Language : eng
Location : Pakistan

http://defencedog.blogspot.com/

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by kirk September 19th 2011, 10:59 pm

oh??
it might depend on the browser as well,
Not sure i would have to play around with it to see.
It may be there is just something you can ad to the cookies part of the code, but what that would be??? not sure at this point.
kirk
kirk
Forumaster

Male Posts : 11037
Reputation : 653
Language : English,Vulcan,Klingon, Romulan,& Gorn

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by ioncube September 19th 2011, 11:27 pm

you always proved a great help to me; can you refer it to someone who can help...will much appreciate


Got this cleared :wouhou:

I have to add this .js file:

https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js

or else this command be useless:
Code:
$.cookie('hidewelcome', 'collapsed');
ioncube
ioncube
Forumember

Male Posts : 279
Reputation : 41
Language : eng
Location : Pakistan

http://defencedog.blogspot.com/

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by ankillien September 20th 2011, 3:43 am

Hi,

Have you added the cookie plugin?


lol..it was already solved Razz

Topic Solved
ankillien
ankillien
Energetic

Posts : 5198
Reputation : 129
Language : English, XHTML, CSS, JS, PHP, SQL

Back to top Go down

Solved Re: Jquery Cookie Problem

Post by ankillien September 20th 2011, 3:46 am

ioncube wrote:I hav done quite a homework in determining the code to be precise the 'cookie code' such that the browser remember my choice!
Vistt this : https://defencedog.googlecode.com/svn/welcomebox/jquery_welcome_box.html

by viewing the source you will determine the two jquery (essential files) that are needed & I ain't tempering with them.
However I had tried to customise this passage:

Code:
<script type="text/javascript" language="javascript">

$(document).ready(function() {
   $('#sliderBox').slideTo({
      transition:300,
      top:'center',
      left:'center',
      inside:window
   });
   $('#mask').height($(document).height());

   jQuery(window).resize(function() {
      $('#sliderBox').stop().slideTo({
         transition:300,
         top:'center',
         left:'center',
         inside:window
      });
   });

   var closeWelcomeBox;

   $(window).scroll(function(){
      if(!closeWelcomeBox){
         $('#sliderBox').stop().slideTo({
            transition:300,
            top:'center',
            left:'center',
            inside:window
         });
      }
   });

   
   $("#closeWelcomeBox").click(function(){
      $('#sliderBox').stop().slideTo({
         transition:500,
         top:-400
          });
          $('#mask').fadeOut(500);
      closeWelcomeBox = true;
      $.cookie('hidewelcome', 'collapsed');
   });
   
   // COOKIES
    var hidewelcome = $.cookie('hidewelcome');
    if (hidewelcome == 'collapsed') {
        $('#sliderBox').css("display","none");
        $('#mask').css("display","none");
        closeWelcomeBox = true;
    };
});

</script>

First I created a cookie when the button is clicked & giv it its respective property namely 'collapse':
Code:
$.cookie('hidewelcome', 'collapsed');
then I simply wrote this to make browser remember users click event choice (via cookie):
Code:
   // COOKIES
    var hidewelcome = $.cookie('hidewelcome');
    if (hidewelcome == 'collapsed') {
        $('#sliderBox').css("display","none");
        $('#mask').css("display","none");
        closeWelcomeBox = true;
    };

This isn't working or am I missing something bwi
ankillien
ankillien
Energetic

Posts : 5198
Reputation : 129
Language : English, XHTML, CSS, JS, PHP, SQL

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum