A pop out box code
3 posters
Page 1 of 1
A pop out box code
http://thejadednetwork.com/
In the homepage you can find a section called "Featured Anime, Manga & Game Wallpapers", [the pictures] and in their when you direct your pointer, you could see a small box popping out and giving some information about the picture.
So how can i get that code?
In the homepage you can find a section called "Featured Anime, Manga & Game Wallpapers", [the pictures] and in their when you direct your pointer, you could see a small box popping out and giving some information about the picture.
So how can i get that code?
Re: A pop out box code
Is called tooltip so have a look at here => http://csshelp.forumotion.net/t42-how-to-add-tooltips-on-your-forum
Re: A pop out box code
- Code:
<style type="text/css">
<!--
.tooltiptitle{COLOR: #FFFFFF; TEXT-DECORATION: none; CURSOR: Default; font-family: arial; font-weight: bold; font-size: 8pt}
.tooltipcontent{COLOR: #000000; TEXT-DECORATION: none; CURSOR: Default; font-family: arial; font-size: 8pt}
#ToolTip{position:absolute; width: 100px; top: 0px; left: 0px; z-index:4; visibility:hidden;}
-->
</style>
<script language = "javascript">
<!--
ContentInfo = "";
topColor = "#808080"
subColor = "#C0C0C0"
var mouse_X;
var mouse_Y;
var tip_active = 0;
function update_tip_pos(){
document.getElementById('ToolTip').style.left = mouse_X + 20;
document.getElementById('ToolTip').style.top = mouse_Y;
}
var ie = document.all?true:false;
if (!ie) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
function getMouseXY(e) {
if (ie) { // grab the x-y pos.s if browser is IE
mouse_X = event.clientX + document.body.scrollLeft;
mouse_Y = event.clientY + document.body.scrollTop;
}
else { // grab the x-y pos.s if browser is NS
mouse_X = e.pageX;
mouse_Y = e.pageY;
}
if (mouse_X < 0){mouse_X = 0;}
if (mouse_Y < 0){mouse_Y = 0;}
if(tip_active){update_tip_pos();}
}
function EnterContent(TTitle, TContent){
ContentInfo = '<table border="0" width="100" cellspacing="0" cellpadding="0">'+
'<tr><td width="100%" bgcolor="#000000">'+
'<table border="0" width="100%" cellspacing="1" cellpadding="0">'+
'<tr><td width="100%" bgcolor='+topColor+'>'+
'<table border="0" width="90%" cellspacing="0" cellpadding="0" align="center">'+
'<tr><td width="100%">'+
'<font class="tooltiptitle"> '+TTitle+'</font>'+
'</td></tr>'+
'</table>'+
'</td></tr>'+
'<tr><td width="100%" bgcolor='+subColor+'>'+
'<table border="0" width="90%" cellpadding="0" cellspacing="1" align="center">'+
'<tr><td width="100%">'+
'<font class="tooltipcontent">'+TContent+'</font>'+
'</td></tr>'+
'</table>'+
'</td></tr>'+
'</table>'+
'</td></tr>'+
'</table>';
}
function tip_it(which, TTitle, TContent){
if(which){
update_tip_pos();
tip_active = 1;
document.getElementById('ToolTip').style.visibility = "visible";
EnterContent(TTitle, TContent);
document.getElementById('ToolTip').innerHTML = ContentInfo;
}else{
tip_active = 0;
document.getElementById('ToolTip').style.visibility = "hidden";
}
}
//-->
</script>
MotorCookie- Forumember
- Posts : 113
Reputation : 1
Language : English
Re: A pop out box code
Matti_7 wrote:Is called tooltip so have a look at here => http://csshelp.forumotion.net/t42-how-to-add-tooltips-on-your-forum
It isn't working.
MotorCookie wrote:
- Code:
<style type="text/css">
<!--
.tooltiptitle{COLOR: #FFFFFF; TEXT-DECORATION: none; CURSOR: Default; font-family: arial; font-weight: bold; font-size: 8pt}
.tooltipcontent{COLOR: #000000; TEXT-DECORATION: none; CURSOR: Default; font-family: arial; font-size: 8pt}
#ToolTip{position:absolute; width: 100px; top: 0px; left: 0px; z-index:4; visibility:hidden;}
-->
</style>
<script language = "javascript">
<!--
ContentInfo = "";
topColor = "#808080"
subColor = "#C0C0C0"
var mouse_X;
var mouse_Y;
var tip_active = 0;
function update_tip_pos(){
document.getElementById('ToolTip').style.left = mouse_X + 20;
document.getElementById('ToolTip').style.top = mouse_Y;
}
var ie = document.all?true:false;
if (!ie) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
function getMouseXY(e) {
if (ie) { // grab the x-y pos.s if browser is IE
mouse_X = event.clientX + document.body.scrollLeft;
mouse_Y = event.clientY + document.body.scrollTop;
}
else { // grab the x-y pos.s if browser is NS
mouse_X = e.pageX;
mouse_Y = e.pageY;
}
if (mouse_X < 0){mouse_X = 0;}
if (mouse_Y < 0){mouse_Y = 0;}
if(tip_active){update_tip_pos();}
}
function EnterContent(TTitle, TContent){
ContentInfo = '<table border="0" width="100" cellspacing="0" cellpadding="0">'+
'<tr><td width="100%" bgcolor="#000000">'+
'<table border="0" width="100%" cellspacing="1" cellpadding="0">'+
'<tr><td width="100%" bgcolor='+topColor+'>'+
'<table border="0" width="90%" cellspacing="0" cellpadding="0" align="center">'+
'<tr><td width="100%">'+
'<font class="tooltiptitle"> '+TTitle+'</font>'+
'</td></tr>'+
'</table>'+
'</td></tr>'+
'<tr><td width="100%" bgcolor='+subColor+'>'+
'<table border="0" width="90%" cellpadding="0" cellspacing="1" align="center">'+
'<tr><td width="100%">'+
'<font class="tooltipcontent">'+TContent+'</font>'+
'</td></tr>'+
'</table>'+
'</td></tr>'+
'</table>'+
'</td></tr>'+
'</table>';
}
function tip_it(which, TTitle, TContent){
if(which){
update_tip_pos();
tip_active = 1;
document.getElementById('ToolTip').style.visibility = "visible";
EnterContent(TTitle, TContent);
document.getElementById('ToolTip').innerHTML = ContentInfo;
}else{
tip_active = 0;
document.getElementById('ToolTip').style.visibility = "hidden";
}
}
//-->
</script>
where do you add that?
Re: A pop out box code
Where do you want the tooltip to be?
MotorCookie- Forumember
- Posts : 113
Reputation : 1
Language : English
Re: A pop out box code
udarsha45 wrote:Matti_7 wrote:Is called tooltip so have a look at here => http://csshelp.forumotion.net/t42-how-to-add-tooltips-on-your-forum
It isn't working.
Because you haven't add id/class for the elements.
Re: A pop out box code
MotorCookie wrote:Where do you want the tooltip to be?
In an HTML page.
Matti_7 wrote:udarsha45 wrote:Matti_7 wrote:Is called tooltip so have a look at here => http://csshelp.forumotion.net/t42-how-to-add-tooltips-on-your-forum
It isn't working.
Because you haven't add id/class for the elements.
Huh? What do you mean?
Re: A pop out box code
If you add the code to a html page, it won't show anything.
MotorCookie- Forumember
- Posts : 113
Reputation : 1
Language : English
Similar topics
» When i paste a long code via [code][/code] the page expands
» Tech please respond! What is the border color code/script code
» I add a new Forum widget for my Affiliates code but I want to remove the code that shows there!
» what's the code to customize the quote/code color for phpbb3?
» help in this code . the effect on code > add button to Put under the colored writing
» Tech please respond! What is the border color code/script code
» I add a new Forum widget for my Affiliates code but I want to remove the code that shows there!
» what's the code to customize the quote/code color for phpbb3?
» help in this code . the effect on code > add button to Put under the colored writing
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum