|
JavaScript - I Need To Get This Centered . . .
I am adding the below text/javascript to an HTML page and I need to get the resulting image centered on the page. Can anyone tell me what and where to add it, thanks
<p> <script type="text/javascript"> he_width=750 he_height=500 he_maptype=k he_show_others = 1; he_zoom = 9; he_lat=39.0517 he_lng=-95.0456 </script> <script type="text/javascript" src="http://aprs.fi/js/embed.js"> </script> </p> Similar TutorialsCode: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Overlay test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#overlay {
background-color: #ccffcc;
display: none;
margin-left: -400px;
position: absolute;
top: -250px;
left: 50%;
width: 800px;
height: 500px;
visibility: visible
}
#container{
color: white;
background-color: #0ff;
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
overflow: visible;
visibility: visible;
display: block
}
</style>
<script type="text/javascript" src="swfobject/swfobject.js"></script>
<script type="text/javascript">
//<![CDATA[
function hide() {
document.getElementById("overlay").style.display = "none";
}
function show() {
document.getElementById("overlay").style.display = "block";
swfobject.embedSWF("helpdeskApp_three.swf", "flashcontent", "800", "500", "9.0.0", "expressInstall.swf");
}
//]]>
</script>
</head>
<body>
<div id="container"> <div id="overlay"><div id="flashcontent">fdgfdg</div>
<a href="#" onclick="hide();">Click me</a> to close.</div></div>
<div><a href="#" onclick="show();">Click me</a> to show the hidden content.</div>
</body>
</html>
I got some of this code from these forums. Thank you. It works great, however I'll be using this code with a school's website's template. The problem is that the "overlay" div tags would be placed within the container div tags of the template,therefore confining to these dimensions. How can I modify my code to have my div tags not affected by the templates div tags... and have the overlay be center in the browser.. Thanks FIXED Hi, I'm trying to this script: http://www.lukescoates.com/designs/plusimageviewer.js to display an enlarged image when a thumbnail is clicked - the page in question is: http://lukescoates.com/designs/portfolio.php. It seems to be working for the most part, however, when I first load the page, sometimes the "View Full Image" buttons don't align with the images, they bulk up together: http://screencast.com/t/r1cauKx6X When I reload the page, they align properly. The next problem is that when I first click on the "View Full Image", the popup is not centered on the page: http://screencast.com/t/4LYou1WfXXJ If I click it a second time, it centers perfectly. Any suggestions? The CSS also associated with this is: http://lukescoates.com/designs/plusimageviewer.css Really appreciate any help! Luke FIXED Hello guys was just wondering if you might be able to help me out im looking for a javascript code that will open a window in 100% width, no toolbars, no menubars, no statusbar, nothing but the page conent basically but for it to all be centered on the screen vertically |
|||||||