Question
2 posters
Page 1 of 1
Question
I have another forumotion forum.(forumotion rules)
I was wondering how you make it so the pop-up message happens when you click "who are we" on the homepage.
Thanks!
I was wondering how you make it so the pop-up message happens when you click "who are we" on the homepage.
Thanks!
tkelly95- Prospect
Re: Question
I'm going to explain this to you since I'm glad you're not a ripper who takes anything without asking for permission
To add the link.
What goes on the window for when you click that link.
To edit that box.
Be sure to edit all the ID's and Classes, replace them with whatever name you want.
Hope it helps!
To add the link.
- Code:
<a onclick = "document.getElementById('name_of_your_div').style.display='block';document.getElementById('fade_div').style.display='block'">Hyperlink</a>
What goes on the window for when you click that link.
- Code:
<div id="name_of_your_div" class="name_of_css_element"><center>
Your HTML coding goes here
<br>
<a href = "javascript:void(0)" onclick = "document.getElementById('name_of_your_div').style.display='none';document.getElementById('fade_div').style.display='none'"><font color="blue" size="2"><u>Close</u></font></a></div>
<div id="fade" class="name_of_css_fade_black_element"></div></center>
To edit that box.
- Code:
<style>
.name_of_css_fade_black_element{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.5;
opacity:.50;
filter: alpha(opacity=50);
}
/* Makes background black */
.name_of_your_css_element {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 25%;
padding: 16px;
background-color: #ffffff;
z-index:1002;
overflow: auto;}
</style>
Be sure to edit all the ID's and Classes, replace them with whatever name you want.
Hope it helps!
Admin- Ultimate SN Fan
Re: Question
The Listener wrote:I'm going to explain this to you since I'm glad you're not a ripper who takes anything without asking for permission
To add the link.
- Code:
<a onclick = "document.getElementById('name_of_your_div').style.display='block';document.getElementById('fade_div').style.display='block'">Hyperlink</a>
What goes on the window for when you click that link.
- Code:
<div id="name_of_your_div" class="name_of_css_element"><center>
Your HTML coding goes here
<br>
<a href = "javascript:void(0)" onclick = "document.getElementById('name_of_your_div').style.display='none';document.getElementById('fade_div').style.display='none'"><font color="blue" size="2"><u>Close</u></font></a></div>
<div id="fade" class="name_of_css_fade_black_element"></div></center>
To edit that box.
- Code:
<style>
.name_of_css_fade_black_element{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.5;
opacity:.50;
filter: alpha(opacity=50);
}
/* Makes background black */
.name_of_your_css_element {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 25%;
padding: 16px;
background-color: #ffffff;
z-index:1002;
overflow: auto;}
</style>
Be sure to edit all the ID's and Classes, replace them with whatever name you want.
Hope it helps!
Thanks!
I'm slightly confused, I'm not the best coder yet.
what is a Div and css?
This is going on my footer, so when somebody clicks the "Terms of use", that box comes up with the sites Terms of use.
tkelly95- Prospect
Re: Question
This code will make you understand a little better.
You can see it in action here. You can use a HTML online editor to edit it according to your tastes.
Hope it's helped.
- Code:
<a onclick = "document.getElementById('hello').style.display='block';document.getElementById('bye').style.display='block'">Click me</a>
<div id="hello" class="cont2">
Whatever you want here
<br>
<a href = "javascript:void(0)" onclick = "document.getElementById('hello').style.display='none';document.getElementById('bye').style.display='none'"><font color="blue" size="2"><u>Close</u></font></a></div>
<div id="bye" class="cont1"></div></center>
<style>
.cont1{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.5;
opacity:.50;
filter: alpha(opacity=50);
}
.cont2 {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 25%;
padding: 16px;
background-color: #ffffff;
z-index:1002;
overflow: auto;}
</style>
You can see it in action here. You can use a HTML online editor to edit it according to your tastes.
Hope it's helped.
Admin- Ultimate SN Fan
Re: Question
The Listener wrote:This code will make you understand a little better.
- Code:
<a onclick = "document.getElementById('hello').style.display='block';document.getElementById('bye').style.display='block'">Click me</a>
<div id="hello" class="cont2">
Whatever you want here
<br>
<a href = "javascript:void(0)" onclick = "document.getElementById('hello').style.display='none';document.getElementById('bye').style.display='none'"><font color="blue" size="2"><u>Close</u></font></a></div>
<div id="bye" class="cont1"></div></center>
<style>
.cont1{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.5;
opacity:.50;
filter: alpha(opacity=50);
}
.cont2 {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 25%;
padding: 16px;
background-color: #ffffff;
z-index:1002;
overflow: auto;}
</style>
You can see it in action here. You can use a HTML online editor to edit it according to your tastes.
Hope it's helped.
Thanks!
I have a question, why is it opening automatically? Without the link being clicked.
I am trying to add a this in my footer, so when somebody clicks "Terms of Use", the sites T.O.U pop up.
The problem is, when I add it to the footer, it opens automatically.
tkelly95- Prospect
Re: Question
Depends on what browser you use. I don't really know, I have already provided you the code, if you're looking for coding help, you're not on the right forum, try getting help on the Support Forum.
Admin- Ultimate SN Fan
Re: Question
The Listener wrote:Depends on what browser you use. I don't really know, I have already provided you the code, if you're looking for coding help, you're not on the right forum, try getting help on the Support Forum.
Thank you!
I figured it out.
tkelly95- Prospect
Similar topics
» Question
» How to ask my question
» Question about the new FB Lay out
» I Have A Question??
» Why has my question dissappeard?
» How to ask my question
» Question about the new FB Lay out
» I Have A Question??
» Why has my question dissappeard?
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum
|
|