Log in

View Full Version : Guide On Doing a Styled Javascript Alert


Epanel
23-05-2007, 06:54 AM
Ok Make your website

2 - Add This To Your Website


<head><style type="text/css">
#modalContainer {
background-color:transparent;
position:absolute;
width:100%;
height:100%;
top:0px;
left:0px;
z-index:10000;
background-image:url(tp.png); /* required by MSIE to prevent actions on lower z-index elements */
}
#alertBox {
position:relative;
width:300px;
min-height:100px;
margin-top:50px;
border:2px solid #000;
background-color:#F2F5F6;
background-image:url(http://www.habboxforum.com/images/statusicon/thread_hot_new.gif);
background-repeat:no-repeat;
background-position:20px 30px;
}
#modalContainer > #alertBox {
position:fixed;
}
#alertBox h1 {
margin:0;
font:bold 0.9em verdana,arial;
background-color:#78919B;
color:#FFF;
border-bottom:1px solid #000;
padding:2px 0 2px 5px;
}
#alertBox p {
font:0.7em verdana,arial;
height:50px;
padding-left:5px;
margin-left:55px;
}
#alertBox #closeBtn {
display:block;
position:relative;
margin:5px auto;
padding:3px;
border:2px solid #000;
width:70px;
font:0.7em verdana,arial;
text-transform:uppercase;
text-align:center;
color:#FFF;
background-color:#78919B;
text-decoration:none;
}
/* unrelated styles */
#mContainer {
position:relative;
width:600px;
margin:auto;
padding:5px;
border-top:2px solid #000;
border-bottom:2px solid #000;
font:0.7em verdana,arial;
}
h1,h2 {
margin:0;
padding:4px;
font:bold 1.5em verdana;
border-bottom:1px solid #000;
}
code {
font-size:1.2em;
color:#069;
}
#credits {
position:relative;
margin:25px auto 0px auto;
width:350px;
font:0.7em verdana;
border-top:1px solid #000;
border-bottom:1px solid #000;
height:90px;
padding-top:4px;
}
#credits img {
float:left;
margin:5px 10px 5px 0px;
border:1px solid #000000;
width:80px;
height:79px;
}
.important {
background-color:#F5FCC8;
padding:2px;
}
code span {
color:green;
}
</style></head>

3. Add This Somewhere in da code

<script language="JavaScript">
<!--
function FP_popUpMsg(msg) {//v1.0
alert(msg);
}
// -->
</script>

4. Add an javascript alert


<body onload="FP_popUpMsg('Dats it :D')">


Made By Epanel Please Do Not Steal!
LondonGoons
23-05-2007, 08:18 AM
Don't believe you but oh well, ask ---mad--- if you can use forum images.

or you ripped.
( not accusing look at code mods)
Epanel
23-05-2007, 08:29 AM
i never wanted to rip images u can chage it i jst like dere console image
LondonGoons
23-05-2007, 08:32 AM
http://www.habboxforum.com/showthread.php?t=355544

This thread you was asking for help, so why should i believe you made it, you could of got it from another website
Epanel
23-05-2007, 08:51 AM
I dident say i made the CODE its jst a guide
LondonGoons
23-05-2007, 09:01 AM
Ok Make your website

2 - Add This To Your Website


<head><style type="text/css">
#modalContainer {
background-color:transparent;
position:absolute;
width:100%;
height:100%;
top:0px;
left:0px;
z-index:10000;
background-image:url(tp.png); /* required by MSIE to prevent actions on lower z-index elements */
}
#alertBox {
position:relative;
width:300px;
min-height:100px;
margin-top:50px;
border:2px solid #000;
background-color:#F2F5F6;
background-image:url(http://www.habboxforum.com/images/statusicon/thread_hot_new.gif);
background-repeat:no-repeat;
background-position:20px 30px;
}
#modalContainer > #alertBox {
position:fixed;
}
#alertBox h1 {
margin:0;
font:bold 0.9em verdana,arial;
background-color:#78919B;
color:#FFF;
border-bottom:1px solid #000;
padding:2px 0 2px 5px;
}
#alertBox p {
font:0.7em verdana,arial;
height:50px;
padding-left:5px;
margin-left:55px;
}
#alertBox #closeBtn {
display:block;
position:relative;
margin:5px auto;
padding:3px;
border:2px solid #000;
width:70px;
font:0.7em verdana,arial;
text-transform:uppercase;
text-align:center;
color:#FFF;
background-color:#78919B;
text-decoration:none;
}
/* unrelated styles */
#mContainer {
position:relative;
width:600px;
margin:auto;
padding:5px;
border-top:2px solid #000;
border-bottom:2px solid #000;
font:0.7em verdana,arial;
}
h1,h2 {
margin:0;
padding:4px;
font:bold 1.5em verdana;
border-bottom:1px solid #000;
}
code {
font-size:1.2em;
color:#069;
}
#credits {
position:relative;
margin:25px auto 0px auto;
width:350px;
font:0.7em verdana;
border-top:1px solid #000;
border-bottom:1px solid #000;
height:90px;
padding-top:4px;
}
#credits img {
float:left;
margin:5px 10px 5px 0px;
border:1px solid #000000;
width:80px;
height:79px;
}
.important {
background-color:#F5FCC8;
padding:2px;
}
code span {
color:green;
}
</style></head>3. Add This Somewhere in da code

<script language="JavaScript">
<!--
function FP_popUpMsg(msg) {//v1.0
alert(msg);
}
// -->
</script>4. Add an javascript alert


<body onload="FP_popUpMsg('Dats it :D')">
Made By Epanel Please Do Not Steal!



hmm





I dident say i made the CODE its jst a guide

Off course =/ why claim you made it then, i don't really like making people feel dumb.. but yeah you deserve it.
Andys
23-05-2007, 02:21 PM
In the code you are using HabboxForum's images which is stealing bandwidth.
Stealing bandwidth is illeagal.
Drompo
23-05-2007, 03:24 PM
How Does that customise it...?
I can shorten your whole code and get exactly the same

<body onload="alert('Dats it :D')">
Invent
23-05-2007, 03:28 PM
Epanel, sorry but you are useless at coding -_-.

You have totally misunderstood that code. The CSS has no effect on the alert as the alert function just does "alert(msg)" &#172;_&#172;.
Blob
23-05-2007, 03:30 PM
Epanel, sorry but you are useless at coding -_-.

You have totally misunderstood that code. The CSS has no effect on the alert as the alert function just does "alert(msg)" ¬_¬.

I agree, It wont style it at all.

Simon get on msn
ScottDiamond
23-05-2007, 03:31 PM
Give him some respect for at least sharing his find. Don't think you're the gods of the place. I get sick seeing people trying to control newbies in this section.

Give him respect for taking the time to share the code with yous and attempt to help people. All you can do is think about critisism. You don't look cool, but you look like a complete idiot.

Thanks for sharing Epanel, I'll +Rep you. :)
Drompo
23-05-2007, 03:33 PM
Give him some respect for at least sharing his find. Don't think you're the gods of the place. I get sick seeing people trying to control newbies in this section.

Give him respect for taking the time to share the code with yous and attempt to help people. All you can do is think about critisism. You don't look cool, but you look like a complete idiot.

Thanks for sharing Epanel, I'll +Rep you. :)
Fair point made but at the end of the day it was quite pointless as he posted 105 lines of script that isn't need. Also the title of the thread doesn't relate to its content as it is not different style of javascript.
Invent
23-05-2007, 03:35 PM
Give him some respect for at least sharing his find. Don't think you're the gods of the place. I get sick seeing people trying to control newbies in this section.

Give him respect for taking the time to share the code with yous and attempt to help people. All you can do is think about critisism. You don't look cool, but you look like a complete idiot.

Thanks for sharing Epanel, I'll +Rep you

Fair 'doos Scott.

Yes he has taken the time to post the code which he got via Google. But when he adds "Made by Epanel." and doesn't even use the code correctly, I'm not sure if I should respect him as much as you would like me to.
Blob
23-05-2007, 03:36 PM
As people have said, it isnt a guide to do it is it?

Simon = Msn plz
ScottDiamond
23-05-2007, 04:34 PM
But when he adds "Made by Epanel." and doesn't even use the code correctly, I'm not sure if I should respect him as much as you would like me to.

Never noticed the last part, sorry. :P

I'm just annoyed of the people who wont show respect to anyone. Example = LondonGoons.
Unpred5000
23-05-2007, 04:47 PM
I was going to say something, but got perm banned for no reason =/

Thanks ScottDiamond.

I was just proving my point that, its pretty stupid cliaming something that isn't yours.

Oh yh, Simon said his a bad coder? but yet you only say me, sorry forgot there your friends, friends always stick together correct?
ScottDiamond
23-05-2007, 04:55 PM
I was going to say something, but got perm banned for no reason =/

Thanks ScottDiamond.

I was just proving my point that, its pretty stupid cliaming something that isn't yours.

Oh yh, Simon said his a bad coder? but yet you only say me, sorry forgot there your friends, friends always stick together correct?

Can you put that in readable format please? I'm not wishing to attempt to read it for the 5th time.
Unpred5000
23-05-2007, 04:57 PM
Then obviously you can't read?
ScottDiamond
23-05-2007, 05:00 PM
If I couldn't read I wouldn't be here. You can't type properly and the wording of that post makes my eyes go weird. Don't even try to act smart, you fail and make yourself look like an ****.
Unpred5000
23-05-2007, 05:14 PM
I was going to say something, but got perm banned for no reason =/

Thanks ScottDiamond.

I was just proving my point that, its pretty stupid cliaming something that isn't yours.

Oh yh, Simon said his a bad coder? but yet you only say me, sorry forgot there your friends, friends always stick together correct?

Ok ill say it again then?

I was going to say something on londongoons, but i got banned.

Thanks scottDiamond, for saying
wont show respect to anyone. Example = LondonGoons.

I was just proving my point, its really stupid claiming a code is yours, when its not.

Understand?
ScottDiamond
23-05-2007, 09:19 PM
OK I'll say it again,

I was going to say something on londongoons, but I got banned.

Thanks ScottDiamond, for saying:


wont show respect. Example = LondonGoons

I was just proving my point, it's really stupid claiming a code is yours, when it's not.

Understand?



I fixed your mistakes for you in your version of 'better wording'.

You don't respect any body's work, no matter if they are brand new or looking for help, you frown on them completely. Yet, when you seek help, you expect everybody to be your best friend. You're like a chav and a Police Officer. They hate them, but when they need them, they are suddenly best friends with them.

No need for the boldness, I can see clearly that you're being immature and lame, no need to point it out to me.
Unpred5000
24-05-2007, 09:41 AM
Oh really?

So, when someone posts their work i have to say its good, i can't say my opinions?

If i don't like it i am going to tell the truth and not lie.
I don't ask for much help actually only once or twice.
Well i do live in north london, figure the chav part your self, go search north london on google maps or whatever.
ScottDiamond
24-05-2007, 03:36 PM
Oh really?

So, when someone posts their work i have to say its good, i can't say my opinions?

If i don't like it i am going to tell the truth and not lie.
I don't ask for much help actually only once or twice.
Well i do live in north london, figure the chav part your self, go search north london on google maps or whatever.

Get your finger out your *** and use it to type sence.
Unpred5000
24-05-2007, 05:06 PM
I type sence, maybe you don't like what my opinions are and don't respect them.

If you don't like my opinions, then simply don't reply.
Lilian
24-05-2007, 05:25 PM
I type sence, maybe you don't like what my opinions are and don't respect them.

If you don't like my opinions, then simply don't reply.

Its up to him if he wants to reply because of your bad opinions not up to you.
Unpred5000
24-05-2007, 05:30 PM
Ok, its up to him, but why start a argument because i have my own views on this.

If Epanel can't make his own codes how can he make a panel.
Lilian
24-05-2007, 05:33 PM
Ok, its up to him, but why start a argument because i have my own views on this.

If Epanel can't make his own codes how can he make a panel.

Because he also has his own views on this. Its a forum so everyone is entitled to their own opinion.
chrisgocrazyH
26-05-2007, 03:08 AM
<html>
<head>
<style type="text/css">
#modalContainer {
background-color:transparent;
position:absolute;
width:100%;
height:100%;
top:0px;
left:0px;
z-index:10000;
background-image:url(tp.png); /* required by MSIE to prevent actions on lower z-index elements */
}
#alertBox {
position:relative;
width:300px;
min-height:100px;
margin-top:50px;
border:2px solid #000;
background-color:#F2F5F6;
background-image:url(http://www.habboxforum.com/images/statusicon/thread_hot_new.gif);
background-repeat:no-repeat;
background-position:20px 30px;
}
#modalContainer > #alertBox {
position:fixed;
}
#alertBox h1 {
margin:0;
font:bold 0.9em verdana,arial;
background-color:#78919B;
color:#FFF;
border-bottom:1px solid #000;
padding:2px 0 2px 5px;
}
#alertBox p {
font:0.7em verdana,arial;
height:50px;
padding-left:5px;
margin-left:55px;
}
#alertBox #closeBtn {
display:block;
position:relative;
margin:5px auto;
padding:3px;
border:2px solid #000;
width:70px;
font:0.7em verdana,arial;
text-transform:uppercase;
text-align:center;
color:#FFF;
background-color:#78919B;
text-decoration:none;
}
/* unrelated styles */
#mContainer {
position:relative;
width:600px;
margin:auto;
padding:5px;
border-top:2px solid #000;
border-bottom:2px solid #000;
font:0.7em verdana,arial;
}
h1,h2 {
margin:0;
padding:4px;
font:bold 1.5em verdana;
border-bottom:1px solid #000;
}
code {
font-size:1.2em;
color:#069;
}
#credits {
position:relative;
margin:25px auto 0px auto;
width:350px;
font:0.7em verdana;
border-top:1px solid #000;
border-bottom:1px solid #000;
height:90px;
padding-top:4px;
}
#credits img {
float:left;
margin:5px 10px 5px 0px;
border:1px solid #000000;
width:80px;
height:79px;
}
.important {
background-color:#F5FCC8;
padding:2px;
}
code span {
color:green;
}
</style>
<script type="text/javascript">
/************************************
Custom Alert Demonstration
version 1.0
last revision: 02.02.2005
[email protected]
Should you improve upon this source please
let me know so that I can update the version
hosted at slayeroffice.
Please leave this notice in tact!
************************************/
var ALERT_TITLE = "Notice!";
var ALERT_BUTTON_TEXT = "Done";
if(document.getElementById) {
window.alert = function(txt) {
createCustomAlert(txt);
}
}
function createCustomAlert(txt) {
d = document;
if(d.getElementById("modalContainer")) return;
mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
mObj.id = "modalContainer";
mObj.style.height = d.documentElement.scrollHeight + "px";

alertObj = mObj.appendChild(d.createElement("div"));
alertObj.id = "alertBox";
if(d.all && !window.opera) alertObj.style.top = document.documentElement.scrollTop + "px";
alertObj.style.left = (d.documentElement.scrollWidth - alertObj.offsetWidth)/2 + "px";
alertObj.style.visiblity="visible";
h1 = alertObj.appendChild(d.createElement("h1"));
h1.appendChild(d.createTextNode(ALERT_TITLE));
msg = alertObj.appendChild(d.createElement("p"));
msg.appendChild(d.createTextNode(txt));
btn = alertObj.appendChild(d.createElement("a"));
btn.id = "closeBtn";
btn.appendChild(d.createTextNode(ALERT_BUTTON_TEXT ));
btn.href = "#";
btn.focus();
btn.onclick = function() { removeCustomAlert();return false; }
alertObj.style.display = "block";

}
function removeCustomAlert() {
document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer"));
}
function FP_popUpMsg(msg) {//v1.0
alert(msg);
}
</script>
</head>
<body onload="FP_popUpMsg('Hello world')">
</body>
</html>

Want to hide these adverts? Register an account for free!