SmokingMan

I use the window.open() method to launch a new window sized to fit a slideshow. It works fine in IE. In FF the new window will open as it should, but when you click on the forward button to get to the next image, you get an error message. In Opera, the window opens correctly, but the slideshow doesn't work at all.It all seemed to be okay until I used the onclick to call the window.open() to open the slideshow window. Here's the code for the .open() method:

function	openShow(url)	{window.open(url,"","location=0,height=425,width=500,left=200,top=50,menubar=0,resizable=0,scrollbars=0,status=0,toolbar=0");}

This is the button code to go forward in the show:

    <td><a href="#" onClick="javascript:control('F');">    <img class="noborder" id="next" src="../../images/next-ssbutton1.gif" alt="Next Image" title="Next Image" width="100" height="17"    onmouseover="imageOn('next'); return statusMsg('Next Image')";    onmouseout="imageOff('next'); return statusMsg('')"></a></td>

And here's the code for the slideshow:

// Set the slideshow speed (in milliseconds)var SlideShowSpeed = 3000;// Set the duration of crossfade (in seconds)var CrossFadeDuration = 4;var Picture = new Array(); var showHot = false;    // Specify the image files...Picture[1] = 'mmMissy062798(1).JPG';Picture[2] = 'mmMissy062798(2).JPG';Picture[3] = 'mmMissy062798(3).JPG';Picture[4] = 'mmMissy062798(4).JPG';Picture[5] = 'mmMissy071303(1).JPG';Picture[6] = 'mmMissy071303(2).JPG';Picture[7] = 'mmMissy071303(3).JPG';Picture[8] = 'mmMissy071303(4).JPG';Picture[9] = 'mmMissy071303(5).JPG';Picture[10] = 'mmMissy071303(6).JPG';Picture[11] = 'mmMissy080302.JPG';Picture[12] = 'mmMissy110403(1).jpg';Picture[13] = 'mmMissy110403(2).jpg';Picture[14] = 'mmMissy110403(3).jpg';Picture[15] = 'mmMissy110403(4).JPG';Picture[16] = 'mmMissy110403(5).JPG';Picture[17] = 'mmMissy110403(6).JPG';Picture[18] = 'mmMissyWaiting.jpg';Picture[19] = 'mmPrettyGirl.jpg';var tss;var iss;var jss = 0;var pss = Picture.length-1;var preLoad = new Array();for (iss = 1; iss < pss+1; iss++){preLoad[iss] = new Image();preLoad[iss].src = Picture[iss];}function control(how){	if (showHot){  if (how=="H") jss = 1;  if (how=="F") jss = jss + 1;  if (how=="B") jss = jss - 1;  if (jss > (pss)) jss=1;  if (jss < 1) jss = pss; 	 if (document.all){ 	 document.images.PictureBox.style.filter="blendTrans(duration=2)"; 	 document.images.PictureBox.style.filter="blendTrans(duration=CrossFadeDuration)"; 	 document.images.PictureBox.filters.blendTrans.Apply();}  document.images.PictureBox.src = preLoad[jss].src;  if (document.all) document.images.PictureBox.filters.blendTrans.Play();  }}

I want to be able to open a smaller window for the slideshow, but I can't seem to figure out why this only works in IE.

I found it. I forgot that pesky little space between the ; and return false;. Picky, picky, picky...It's working fine now.

Well that worked...mostly. I now get the new separate window to open with my parameters, but the same window also opens in the current browser. So you end up with two browser windows open with the same page, but one is the first browser and the other is the one that conforms to the .open() parameters.I think I figured it out. I have the URL in the href attribute in the <a>...</a> and also in the onclick event. But if I remove it from the href, will the onclick still work if JS is disabled?

Okay...here goes. Here's the script I'm using:

function	openShow(url)	{window.open('url',location=0,height=450,width=500,left=200,top=50,menubar=0,resizable=0,scrollbars=0,status=0,toolbar=0);	}

And here's the link I'm trying to open:

<tr><td class="menu"><a href="http://testdomain.ftwin.com/albums/missy/missy-slideshow.html" class="child1" 					onmouseover="return addressMsg('Missy\'s Photo Slideshow')" onmouseout="return addressMsg('')"					onclick="openShow('http://testdomain.ftwin.com/albums/missy/missy-slideshow.html');return false;">Missy's Slideshow</a></td></tr>

In IE it opens a new window, but it opens as a full screen window with all of the attributes. All of my restrictions are ignored, and it's not a new separate window like I want it to be.In FF I get two new windows, but both have error messages. The first one opens to my specifications, with this message:

Not FoundThe requested URL /url was not found on this server.Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

The other window is a new full screen window with this message:

Not FoundThe requested URL /0 was not found on this server.Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

That's two windows with different errors. I haven't tried Opera yet, I'm afraid to see what happens there. Any ideas?If you want to try it, here's the link to the page. You'll want to go to Missy's Slideshow under Slideshows.

why are you using javascript for this? your making it way harder than it is..<a href="http://my.url.com" target="_blank">some link</a>

I'm using JS because the "target" attribute has been deprecated. It may still work in all browsers, but it doesn't validate as XHTML Strict. This script will open a slideshow and I just want the window large enough to contain the show, so I have to control how the window displays.

Not in opera! Opera has hot looking bars that flash on mouseover.

I stand corrected. I have Opera, but only use it to view my pages to be sure they render correctly

Well I suppose the good news would be that most people still use IE (although I don't know why), so they will still be able to see the custom scrollbars. The rest of us will be looking at standard chrome

<a href='...' onclick='openWin("http://my.url.com");'>Some Link</a>

I'm assuming that I still place the URL to be opened in the href attribute?

I want to use the .open() method to open new windows depending on the link clicked by the user. How do I change the URL parameter in the method depending on the link clicked, or do I need to set up a separate function for each link? I would think there would have to be a way to use one function and modify it for each link as needed. Or maybe use an if...else structure for the links?I'm open to suggestions.

I have buttons used for onmouseover, onmouseout, & onclick events. The onclick event does not work. There is an onclick event in the <a> tag that works, but the one in the <img> tag does not. Since they are in two different tags, I thought it would work. But since the <img> tag is in the <a> tag, would that prevent the onclick event in the <img> tag from working? Here's the link to the page.I can live without the 3rd event, but I don't want to if I don't have to

I'm not aware of any way to check the status of a media file using the <embed> tag. Here's a link that gives you all of the info on the tag, but while it may work in most browsers (for now), it's not supported by the W3C standards. They recommend using the <object> tag. You can go here for more info on that.

Got it!!I had to add a width style to the top <td> in the menu so IE knew what to do. Of course FF & Opera understood with the cols attribute in the <table> tag, but it's not like this is a surprise.Thanks Bill for making simple coding like this such an adventure. I'd hate to think how boring and mundane it would be if everyone supported the same standards.

Okay...I've got the PHP link thingy working now across IE & FF. The only real problem now, is in FF the top level cells are of equal size, but not in IE. There has to be something real simple I'm missing and will be embarrassed about once it's pointed out, but right now it's got me stumped.I have the table tag as <table cols="4" border="0">. Like I said, the cells are of equal size in FF, but not in IE.

It works fine. I know this isn't the PHP board, but it looks like that's where my problem is. Do I need to save the file to be included with a .php extension? The file it's written to has a .php extension, but the file being included has a .html extension. I also don't have any PHP code on the menu page, only the pages that call it. Could that be my problem?But some of the menu does work, just not the entire thing, and it's formatted differently in IE than in FF. So I'm assuming the path is correct in all of the pages. It's got me scratching my head.

Okay, I changed all of the CSS back to the way it was without the images, and now it works fine...kinda. In IE the bar's cell sizes are unequal on the top level but in FF they're fine. Also, when you go to the only live link that is in the menu so far, the <br />'s and sub menu don't show up. I think that has something to do with PHP though. But I don't know PHP so I'll need someone to help me with that. Does the file being included with PHP need to be in the same directory? But then why would part of the formatting work and not all of it?

The only difference is that I am now using a PHP "require" to insert the menu. I plan on using this same menu across all pages of the site and wanted to use PHP to insert it in each page. That way I only have one file to modify instead of several when a change needs to be made. I may just have to go ahead and hard code it into each page and then modify every page when I need to change something

Okay, I have the menu working really nice in FF & Opera, but...well...then there's IE. The sub menus don't display in the right place, they're offset too far to the right, and the images I use for backgrounds in the sub menu take time to display, if they do at all. Sometimes they don't and all you get is the black background. Other than requiring everyone visiting my site to use anything but IE, how do I fix this?Here's the link to the page, and here's the link to the CSS for the menu bar.

That worked. Don't ask me what I was thinking with the 12.5% margin, I'll claim mad cow on that one

I'm working through a W3C example of a drop down menu, and I have a question on the positioning of the hidden (or drop down) menu. The style uses absolute positioning, and when displayed, offsets to the right from the parent menu. I've tried relative positioning and using margin-left with negative numbers along with the absolute positioning, and still can't get the sub menu to move to the left. The menu works as is, but I would like to know how to adjust the positioning of the hidden drop down in case the page would require it.Here's the code I'm playing with:

<style>body	{	font-family:arial;	}table	{	font-size:80%;	background:black;	width: 75%;	margin-left: 12.5%;	}td.menu	{	background:lightblue;	width: 150px;	}table.menu	{ 	 font-size:90%;	width: 150px; 	 position:absolute;  visibility:hidden;	}a	{	color:black;	text-decoration:none;	font:bold;	}a:hover	{	color:#606060;	}</style><script type="text/javascript">function showmenu(elmnt)	{	document.getElementById(elmnt).style.visibility="visible"}function hidemenu(elmnt)	{	document.getElementById(elmnt).style.visibility="hidden"}</script></head><body><h3>Drop down menu</h3><table> <tr bgcolor="#FF8080">  <td onmouseover="showmenu('tutorials')" onmouseout="hidemenu('tutorials')">   <a href="/default.asp">Tutorials</a><br />   <table class="menu" id="tutorials">   <tr><td class="menu"><a href="/html/default.asp">HTML</a></td></tr>   <tr><td class="menu"><a href="/xhtml/default.asp">XHTML</a></td></tr>   <tr><td class="menu"><a href="/css/default.asp">CSS</a></td></tr>   <tr><td class="menu"><a href="/xml/default.asp">XML</a></td></tr>   <tr><td class="menu"><a href="/xsl/default.asp">XSL</a></td></tr>   </table>  </td>  <td onmouseover="showmenu('scripting')" onmouseout="hidemenu('scripting')">   <a href="/default.asp">Scripting</a><br />   <table class="menu" id="scripting">   <tr><td class="menu"><a href="/js/default.asp">JavaScript</a></td></tr>   <tr><td class="menu"><a href="/vbscript/default.asp">VBScript</a></td></tr>   <tr><td class="menu"><a href="default.asp">DHTML</a></td></tr>   <tr><td class="menu"><a href="/asp/default.asp">ASP</a></td></tr>   <tr><td class="menu"><a href="/ado/default.asp">ADO</a></td></tr>   </table>  </td>  <td onmouseover="showmenu('validation')" onmouseout="hidemenu('validation')">   <a href="/site/site_validate.asp">Validation</a><br />   <table class="menu" id="validation">   <tr><td class="menu"><a href="/site/site_validate.asp">Validate HTML</a></td></tr>   <tr><td class="menu"><a href="/site/site_validate.asp">Validate XHTML</a></td></tr>   <tr><td class="menu"><a href="/site/site_validate.asp">Validate CSS</a></td></tr>   <tr><td class="menu"><a href="/site/site_validate.asp">Validate XML</a></td></tr>   <tr><td class="menu"><a href="/site/site_validate.asp">Validate WML</a></td></tr>   </table>  </td> </tr></table></body></html>

Any suggestions?I should clarify, displays different in IE than in FF (what a surprise)!

With a little customization, this should work fine. I'm not exactly sure how you would do any more sub levels than the one in the menu, but this should do the job for what I'm doing right now. I suppose you would need to do some relative postioning for any more levels. But not right now. That can be a project for a future site

You know...I looked forever for a menu like this that I could go through and understand, and spruce it up with my own graphics. I looked all over W3C, and with Google, and couldn't find what I was looking for, at least nothing straight forward and fairly easy to understand. They must have kept this hidden from me for reasons unknown But this should give me the basic idea as to how to make this menu do what I want.Thanks

Yeah, go ahead and pop my balloon, rain on my parade, yada yada yada...

I guess I didn't quite clarify. There is no special message in FF or Opera, the menu just works correctly. But in IE there is a flicker every time you hover over any of the sub menu links, and the status bar message only appears for a brief moment, then disappears. When the menu buttons are flickering, I finally caught the status bar message showing that it's downloading the top button background image when you hover over the sub menu links.Now I don't know why it would want to download the top level background images when you hover over the sub menu links. But would using an array to precache the images work to at least help with the delay? That would take care of one headache.

Okay, go to here and hover over the menu bar using IE (don't use FF or Opera, they work correctly). While you're doing that, look at the status bar for the messages. Why does the message disappear at the same time the background image is changing, without having to move the mouse? Something isn't right here

I try first to get my pages to validate, and then to render correctly in FF & Opera, then after getting over the shock of looking at it in IE, do whatever work arounds needed to make it work in IE.Are you listening Bill?!!