Making a closeable alert box (Like we have here at the top for alerts)?
12 replies, posted
I'm wondering how to go about making an alert box (You know, like the one at the top that says "Hi Username! We've started automatically closing big threads..." etc.) that you can close. I know how to make the actual box itself using styles and whatnot, but i don't know how to make it closeable like you can here.
I would use jQuery.
Here is some tutorials: [url]http://blog.themeforest.net/screencasts/jquery-for-absolute-beginners-video-series/[/url]
Sample html, without the need for jQuery:
[code]
<html>
<head>
<title>blah</title>
<script type="text/javascript">
function hideById( id )
{
document.getElementById( id ).style.visibility="hidden";
}
</script>
</head>
<body>
<div id="test">This is a test<a href="javascript:hideById('test')">Click Me to close</a></div>
</body>
</html>
[/code]
You gotta throw in some ajax or cookie programming in there to make sure it doesn't reappear once the page opens.
[QUOTE=Jimmy422;15924928]I'm wondering how to go about making an alert box (You know, like the one at the top that says "Hi Username! We've started automatically closing big threads..." etc.) that you can close. I know how to make the actual box itself using styles and whatnot, but i don't know how to make it closeable like you can here.[/QUOTE]
Use javascript to close it (set its "display" property to "hidden") and make a cookie so the web server doesn't send it again.
[QUOTE=Catdaemon;15940051]Use javascript to close it (set its "display" property to "hidden") and make a cookie so the web server doesn't send it again.[/QUOTE]
This but also it should obviously expire at some point server-side.
Advil0 set [url=http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm]this[/url] up on my forums a while back. It's a cool Jquery plugin for collapsable divs, with persistence settings (I.E. it sets a cookie so it stays hidden.)
[QUOTE=Splatzone;15957251]Advil0 set [url=http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm]this[/url] up on my forums a while back. It's a cool Jquery plugin for collapsable divs, with persistence settings (I.E. it sets a cookie so it stays hidden.)[/QUOTE]
Overkill IMO. That's a ton of code for something as simple as this. If you use jQuery you can just say
[code]<a href="#asd" onclick="$('#divid').hide('fast')">Close</a>[/code] to close the div. Just change "#divid" to whatever the id of the div you want to close is.
[QUOTE=Kat of Night;15961584]Overkill IMO. That's a ton of code for something as simple as this. If you use jQuery you can just say
[code]<a href="#asd" onclick="$('#divid').hide('fast')">Close</a>[/code] to close the div. Just change "#divid" to whatever the id of the div you want to close is.[/QUOTE]
You're missing the whole point, that it should stay hidden after you load the page again.
[QUOTE=Ortzinator;15965167]You're missing the whole point, that it should stay hidden after you load the page again.[/QUOTE]
[quote][b]to close the div.[/b][/quote]
I know that; i was offering a little tidbit because my javascript ability doesn't extend to sending cookies and such right now.
[QUOTE=aschmack;15932133]Sample html, without the need for jQuery:
[code]
<html>
<head>
<title>blah</title>
<script type="text/javascript">
function hideById( id )
{
document.getElementById( id ).style.visibility="hidden";
}
</script>
</head>
<body>
<div id="test">This is a test<a href="javascript:hideById('test')">Click Me to close</a></div>
</body>
</html>
[/code][/QUOTE]
This works well, but now i need to figure out how to make a cookie to keep it that way. I'm a noob when it comes to javascript, could I get a little help?
[url]http://www.w3schools.com/js/js_cookies.asp[/url]
First result on google.
I would rather use a session with php... Since the user can disable cookies, but not sessions.
Sorry, you need to Log In to post a reply to this thread.