...

View Full Version : javascript alerts



ImperialSpider
10-20-2005, 04:08 AM
Is there a way to position the javascript alert on a webpage? Currently they only pop up in the center of the screen. I would like to have them pop up at a specific location within the website, so as to point out something specific within the website, and I would not have to make such a large message alert to explain what I want from the user...Is there a way to do this?



Thanks in advance for any help

Imperial Spider

PhotoJoe47
10-20-2005, 07:08 AM
Here is the code that I used to create a pop-up where I wanted it when mouse pointer rolled over the hot stop.

First use have to set a style id in the head section of the page. You also have enter the javascript to have a onmouseover and onmouseout event make the popup visible, invisible.




<!-- Define the popup styles here. You must -->
<!-- have a style for each popup you define!! -->
<style>
#example1
{
position:absolute;
width:400px;
color:blue;
background-color:#FDF5E6;
layer-background-color:#FDF5E6;
visibility:hidden;
z-index:10;
}
</style>

<SCRIPT LANGUAGE="JavaScript">
<!-- #2 ***** Copyright Notice ***** -->

<!-- Original: Donnie Brewer (brewsky@home.com) -->
<!-- Web Site: http://www.brewskynet.com/javatest/popup.html -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
function ViewData(e,id,ValueShow) {
var mousex = (document.layers) ? e.pageX : e.clientX + document.body.scrollLeft;
var mousey = (document.layers) ? e.pageY : e.clientY + document.body.scrollTop;
if (document.layers) {
var el = document[id];
el.visibility = ValueShow;
el.pageX = 20;
el.pageY = mousey;
}
else {
var el = document.all(id);
el.style.visibility = ValueShow;
el.style.left = 20;
el.style.top = mousey;
}
}// End -->
</script>




Next in the body section of the page I set up a table using the style Id that I created above.



//the code to call the ViewData() function.

<a href="javascript:;"
onmouseover="ViewData(event,'example1','visible')"
onmouseout="ViewData(event,'example1','hidden')">
<font size="4" color="#00FF00">
<b>Please Read My Copyright Notice</b>
</font>
</a>



<!-- Table Definition for Popup -->

<!-- All tables must have there own style sheet assigned to it -->
<!-- Example1 Popup Data -->
<div id="example1">
<table border="3" bordercolor="#FFA07A" cellspacing="5" cellpadding="5">
<tr valign="middle">
<td align="justify" valign="top" width="400">
<font color=Blue>
<p align='justify'>
All photographs are copyrighted by Joe Bottomlee.
If you find a picture you would like to use, just use the email button
in the navigation bar to the left. Send me the slide number and details
of the intended use and I will then send you a copy at the resolution
you request (72 to 2700). There will be no charge for non-profit,
personal use. For all commercial uses there will be a small fee,
depending on the intended use.
</p>
</font>
</td>
</tr>
</table>
</div>

<!-- End Popup Definitions -->




Now I didn't make good notes for myself on which values you need to change to move the box but I think the el.pageX, el.pageY or el.style.left, el.style.top variables with position the top left corner of the popup.

Hope this helps.

PhotoJoe

Philip M
10-20-2005, 07:24 AM
There is no way to alter the position or shape or font of
the standard Javascript alert, confirm and prompt boxes, but of
course you can make a pop-up of your own creation in lieu.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum