I've found a lovely popup script that I'm using in an AJAX/ASP application. It works a treat, but won't seem to let me take it that extra step and use variable data in it. Here're the functions that set it up:
and here's the popup display:
here's the trigger code:
'conkid(looper)' absolutely contains a value, but try as I might, I can't pick up the conid value, even though it's a global and contains the value at every other turn. Indeed, the 'document.write("CON ME: "+conid);' statement doesn't even print out the CON ME: element! I don't pretend to be very adept where JavaScript's concerned, but this is frying my head. Hopefully I'm just missing something fundamental, but any help would be greatly appreciated,
Ralph
Code:
<script type='text/javascript'>
function myPopupRelocate() {
var scrolledX, scrolledY;
if( self.pageYOffset ) {
scrolledX = self.pageXOffset;
scrolledY = self.pageYOffset;
} else if( document.documentElement && document.documentElement.scrollTop ) {
scrolledX = document.documentElement.scrollLeft;
scrolledY = document.documentElement.scrollTop;
} else if( document.body ) {
scrolledX = document.body.scrollLeft;
scrolledY = document.body.scrollTop;
}
var centerX, centerY;
if( self.innerHeight ) {
centerX = self.innerWidth;
centerY = self.innerHeight;
} else if( document.documentElement && document.documentElement.clientHeight ) {
centerX = document.documentElement.clientWidth;
centerY = document.documentElement.clientHeight;
} else if( document.body ) {
centerX = document.body.clientWidth;
centerY = document.body.clientHeight;
}
var leftOffset = scrolledX + (centerX - 600) / 2;
var topOffset = scrolledY + (centerY - 200) / 2;
document.getElementById("styled_popup").style.top = topOffset + "px";
document.getElementById("styled_popup").style.left = leftOffset + "px";
document.getElementById("styled_popup").style.display = "block";
}
//fade functions
function setOpacity( value ) {
document.getElementById("styled_popup").style.opacity = value / 10;
document.getElementById("styled_popup").style.filter = 'alpha(opacity=' + value * 10 + ')';
}
function fadeInMyPopup() {
for( var i = 0 ; i <= 100 ; i++ )
setTimeout( 'setOpacity(' + (i / 10) + ')' , 4 * i );
}
function fadeOutMyPopup() {
for( var i = 0 ; i <= 100 ; i++ ) {
setTimeout( 'setOpacity(' + (10 - i / 10) + ')' , 4 * i );
}
setTimeout('closeMyPopup()', 400 );
}
function closeMyPopup() {
document.getElementById("styled_popup").style.display = "none"
}
//end fade
function fireMyPopup(conid) {
setOpacity( 0 );
myPopupRelocate();
document.getElementById("styled_popup").style.display = "block";
document.body.onscroll = myPopupRelocate;
window.onscroll = myPopupRelocate;
fadeInMyPopup();
}
</script>and here's the popup display:
Code:
<div id='styled_popup' name='styled_popup' style='width: 680px; height: 300px; display:none; position: absolute;'>
<table width='680' cellpadding='0' cellspacing='0' border='0'>
<tr>
<td><img height='23' width='656' src='images/x11_title.gif'></td>
<td><a href='javascript:fadeOutMyPopup();'><img height='23' width='24' src='images/x11_close.gif' border='0'></a></td>
</tr>
<tr><td colspan='2' bgcolor="#990033" style='background: url("images/x11_body.gif") top left; width: 680px; height: 277px;'>
POPUP CONTENT GOES HERE :o)
<script language="JavaScript">
document.write("CON ME: "+conid);
</script>
</td></tr>
</table>
</div>here's the trigger code:
Code:
<input type='submit' value=' Fire ! ' onClick='fireMyPopup(<%=conkid(looper)%>)'>'conkid(looper)' absolutely contains a value, but try as I might, I can't pick up the conid value, even though it's a global and contains the value at every other turn. Indeed, the 'document.write("CON ME: "+conid);' statement doesn't even print out the CON ME: element! I don't pretend to be very adept where JavaScript's concerned, but this is frying my head. Hopefully I'm just missing something fundamental, but any help would be greatly appreciated,
Ralph
)' shows up in the 'styled_popup':