Sticky Note with 24 cookie and also a "never display again" option.

[jscheuer1]

Do you mean click anywhere outside it, or on a specific link or image outside of it?

If you want 'anywhere outside it' add the jQuery(function($) as shown:

var mysticky2=new stickynote({
	content:{divid:'stickynote2', source:'stickydata.txt'},
	pos:['right', 'bottom'],
	showfrequency: 'cookie',
	days: 7,
	delay: 10 //<--no comma following last setting!
});

jQuery(function($){
	var thenote;
	$('*').bind('click', function(e){
		thenote = $('#stickynote2, #stickynote2 *');
		if(thenote.index(e.target) > -1){return;}
		mysticky2.showhidenote('hide');
	});
});

Notice where information (highlighted/colored) in the init for the stickynote must match that in the added code.

If you just want a link or image, add an onclick to it, ex:

<a href="#" onclick="mysticky2.showhidenote('hide'); return false;">Close That Box!</a>

There's another option, the hidebox option:

var mysticky2=new stickynote({
	content:{divid:'stickynote2', source:'stickydata.txt'},
	pos:['right', 'bottom'],
	showfrequency: 'cookie',
	days: 7,
	hidebox: 20,
	delay: 10 //<--no comma following last setting!
})

That will hide the box after 20 seconds.

[sitemasters]

Is there a way of implementing the "never display again", but without a visible checkbox? Could we use a hidden input field for instance and pass a value 1 instead.

I want a sticky note along the top that appears every time until the visitor closes it. Once closed a cookie is set for ten years and the note is never seen again.

[jscheuer1]

For that, you don't need a checkbox or hidden input. Simply set it up for a ten year cookie:

var mysticky2=new stickynote({
	content:{divid:'stickynote2', source:'stickydata.txt'},
	pos:['right', 'bottom'],
	showfrequency:'cookie',
	days: 10 * 365  //<--no comma following last setting!
})

[sitemasters]

Hi John, no I think you may have read my post wrong.

To reiterate, if you check back to the start of this thread it talks about using a checkbox as an optout

Opt Out: <input type="checkbox" class="optout" /><br />

Can we adapt this for a hidden input field or add an extra option to showfrequency?

[jscheuer1]

Hmm. You've revived an old thread.

Generally you should start a new thread for a new question. Since you're new, we will let that slide for now.

In the future though, please start your own thread for a question, rather than tack on to an old thread (what you did here) or interrupt a thread, even if it's about the exact same thing.

So, let's see what we've got here. A 10 year cookie on close. I see now how that's a little different than what I answered, but not much. If you follow my advice from my last post, once the user sees the sticky, they will never see it again (for 10 years or until cookies are cleared). That may or may not be better than requiring them to close it in order not to see it again.

If we want to go with the original request though - requiring them actively to close it before setting the 10 year cookie, we can make an unseen opt out checkbox (on page init):

var mysticky=new stickynote({
	content:{divid:'stickynote1', source:'inline'},
	showfrequency:'always',
	hidebox:5,
	days: 10 * 365
})

HTML markup:

<div id="stickynote1" class="stickynote"><input style="position:absolute;visibility:hidden" type="checkbox" class="optout" />
<img src="http://i52.tinypic.com/2usu1ad.gif" align="left" />Display any content here, from text, images, to rich HTML. Use the close link to dismiss the box. Click the close box to dismiss it.

<div align="right">
<a href="#" onclick="mysticky.showhidenote('hide');jQuery('#stickynote1 .optout').attr('checked', true).trigger('click'); return false">Hide Box</a>
</div>
</div>

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

Oh, and by the way, I have a version of this script that can, once a user has opted out, present an opt in checkbox elsewhere on the page, which if checked will show the sticky note the next time the page is loaded. This could optionally be combined with showing the note. Let me know if you're interested in that.

[sitemasters]

I already tried visibility hidden and checked="checked" but that didn't work, clearly I was missing the jQuery in the hide box link, and specifically trigger click.

I only suggested a hidden checkbox because I was clinging on to this thread. A better way would perhaps have a new option showfrequency:'always-until-closed' and have no checkbox at all, hidden or otherwise. I can see now that it would have been better to have opened a new thread and suggested that instead, so I apologise for not having done so.

Actually an always-until-closed is not that much of a strange thing to ask, most UK websites since the introduction of the cookie law last year have a sticky note or bar warning the user that this site uses cookies. The only way to stop the message is to close the box. Very annoying I know, but that seems to be the method sites are using to stay compliant with the law.

But yes for anyone following this thread I can confirm that the above code modifications do work.

[jscheuer1]

In that case, for the on page init you would not want the hidebox property. And I've since discovered that the days need not be specified either, they're hard coded into the script for optout. So you would have for that part just:

var mysticky=new stickynote({
	content:{divid:'stickynote1', source:'inline'},
	showfrequency:'always'
})

[sitemasters]

OK, thank you.

[jscheuer1]

And just now I see that in jQuery 1.9+, triggering a click on a checkbox changes its checked state. So, if using jQuery greater than 1.8.2, we need to remove the highlighted:

<div id="stickynote1" class="stickynote"><input style="position:absolute;visibility:hidden" type="checkbox" class="optout" />
<img src="http://i52.tinypic.com/2usu1ad.gif" align="left" />Display any content here, from text, images, to rich HTML. Use the close link to dismiss the box. Click the close box to dismiss it.

<div align="right">
<a href="#" onclick="mysticky.showhidenote('hide');jQuery('#stickynote1 .optout').attr('checked', true).trigger('click'); return false">Hide Box</a>
</div>
</div>

or change it to false.