Click to See Complete Forum and Search --> : set div visible using js
beeready
11-15-2003, 04:25 PM
Help please! I am really hoping someone can point me in the right direction on this since it is driving me CRAZY!
I have a couple of .swf's done in wmode and I want to automatically tell NS users to see the .gif versions. I'm not even trying to break it up by NS version. I just want it to be if IE then div=visible and if NS then div=hidden.
<script language="javascript"> <!-- if (navigator.appName == "Microsoft Internet Explorer") {document.write("<div id='left' style='visibility:visible;'>")} else {document.write("<div id='left' style='visibility:hidden;'>")} //--> </script>
That is what I have so far and rather than showing the Flash in IE and hiding it in NS it is doing the opposite!!! And yes I have tried switching the 'visible' and 'hidden'. That doesn't work either <g>
What am I doing wrong? I have looked all over for a script which does this but all I can find is menu scripts and they don't quite do what I need :(
TIA very very much :)
Barrie
gil davis
11-15-2003, 06:10 PM
Try this:
<script language="javascript">
<!--
if (document.all)
{document.write("<div id='left' style='visibility:visible;'>")}
else
{document.write("<div id='left' style='visibility:hidden;'>")}
//-->
</script>
beeready
11-15-2003, 06:19 PM
Thanks Gil :) Unfortunately that didn't work either though :( It is still doing the same thing where it shows the Flash in NS and the .gif in IE! I have got to just be doing something stupid I know but I have tried it every way I can think of!
Just to make sure that it isn't an implementation error on my part:
I am putting the JS in the body of the page immediately before the <div id="left">
I don't have visibility set in the style sheet or the html for either div.
Thoughts on what I am doing wrong?
Barrie
gil davis
11-15-2003, 07:40 PM
You shouldn't have another DIV before the script. The script should write the DIV opening tag.
The script says to make the DIV contents visible for IE, and hidden for any other browser.
If you want more help, how about posting a link, or more of your page?
As long as you are using document.write(), you could just write the flash tag for IE and the image tag for others.
beeready
11-15-2003, 08:02 PM
I'm majorly confused!
I don't need to even put the <div> tag in there? I thought it had to be in there a) for the other div attributes and b) to give it an id?
Here is the code. I don't have the page up anywhere yet but I can toss it up if you need to be able to see it.
Thank you so much for trying to help me when I'm obviously totally messing it up!!!!
Barrie
P.S. edited at 5:30 EST 11/16/03
I deleted all the code because it was taking up so much room. I went ahead and tossed the page up here:
http://www.salon1050.com/
If anyone needs the actual code to muck around with I can email it to you or put it back in a message in here, just let me know :)
Any help very much appreciated as this is just making me CRAZY!!!
-b
beeready
11-17-2003, 10:07 AM
Ack! I've gotten knocked to the third page!
Please, I really need to figure out how to get this to work!
This is the code Gil gave me in situ
[QUOTE]<body>
<script language="javascript">
<!--
if (document.all)
{document.write("<div id='left' style='visibility:visible;'>")}
else
{document.write("<div id='left' style='visibility:hidden;'>")}
//-->
</script>
<div id="left">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="750" height="720">
<param name="movie" value="file:///C|/CCK/SDWD/Salon1050/11-10-03/salon1050-header.swf">
<param name="quality" value="high">
<param name="wmode" value="transparent">
<embed src="file:///C|/CCK/SDWD/Salon1050/11-10-03/salon1050-header.swf" width="750" height="720" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object>
</div>
<div id="nsheader">
<img src="salon1050-header.gif" width=742 height=246>
</div>[QUOTE]
But, I also need to use it in two other places on the page. It is up at the link in the above post so you can see that it shows the flash in NS and not in IE which is the opposite of what I need to do because of the wmode problems in NS.
Can anyone tell me how to fix this?!?
Thank you for ANY help :)
Barrie
gil davis
11-17-2003, 01:12 PM
Originally posted by beeready
<div id="left">Take this out!
beeready
11-17-2003, 01:21 PM
Still doing the same thing :(
This is what I have now:
<body>
<script language="javascript">
<!--
if (document.all)
{document.write("<div id='left' style='visibility:visible;'>")}
else
{document.write("<div id='left' style='visibility:hidden;'>")}
//-->
</script>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="750" height="720">
<param name="movie" value="file:///C|/CCK/SDWD/Salon1050/11-10-03/salon1050-header.swf">
<param name="quality" value="high">
<param name="wmode" value="transparent">
<embed src="file:///C|/CCK/SDWD/Salon1050/11-10-03/salon1050-header.swf" width="750" height="720" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object>
</div>
Sorry to be so obviously an idiot!
Barrie
gil davis
11-17-2003, 02:23 PM
Well, I tried. After the 50th line, I gave up. There are just too many errors in your page. You have mismatched DIV tags all over the place. I only meant for you to take out the one, not all of them.
Other errors:
1) two body tags
2) meta statement in body
3) no </script> tag for the first script
4) no quotes in tags - so many places I stopped counting
According to W3 recommendations, all parameters in an HTML tag should have quotes around them. IE allows you to get away with not doing it, but NS will not.
If you want to start over with a page that just has the one thing in it you are falling over, maybe I'll take another look. Keep it simple.
Alternately, put up a page that works the way you want it in IE and I'll try and make it work in NS - assuming you at least get it past a W3 validator (re: the quotes).
It looks like you used a WSYIWYG editor, so maybe I was too hard on you. ;)
beeready
11-17-2003, 04:42 PM
Gil,
Try this:
http://www.salon1050/test.htm
I took it down to just the js you told me to use and the header in both Flash and .gif form.
When I went to validate it all the errors I got came out of the Flash stuff. I took it back to the way that Dreamweaver wants you embed the object (and yes I know the current potential pitfalls with embedded objects) and I STILL get 10 errors on validation but all are from the HTML that Flash/Dreamweaver spits out.
I really don't quite know what to do about that?
The new stylesheet returns no errors on the W3C's CSS validator and there are no style attributes within the HTML except those within your js.
Doing it this way I get both the .swf and the .gif in IE and nothing in NS.
Perhaps now that we've gotten a lot of junk out of the way we can determine some way to show the .gif to NS and the .swf to IE? And then I can just apply that to the two other .swf's I would like to place in the page?
Thank you!!!
Barrie
gil davis
11-17-2003, 09:21 PM
There is something wrong with your object tag. Once I commented it out and left the embed tag, it dawned on me what you were trying to do. See attached.
gil davis
11-17-2003, 09:47 PM
I just tried it in NS 4, and it doesn't work right. Here is a "better" solution. I also changed your style sheet.
beeready
11-18-2003, 12:55 AM
Gil,
I uploaded your version to the same location:
http://www.salon1050.com/test.htm
w/ your version of the stylesheet
Now I'm getting the .swf only in IE (Yippee!!!) but nada in NS.
I've double checked and the .gif does exist and is in the correct location on the server.
You have it narrowed down to only 3 errors on the validator:
Line 9, column 29: required attribute "TYPE" not specified (explain...).
<script language="javascript">
^
Line 12, column 213: end tag for element "EMBED" which is not open (explain...).
...ve-flash' wmode='transparent'></embed>");}
^
Line 16, column 22: end tag for element "DIV" which is not open (explain...).
document.write("</div>");
If nothing else this has been an immense learning experience for me!
Barrie
gil davis
11-18-2003, 06:35 AM
<script ... type="text/javascript">
document.write(...<\/embed>");
document.write(...<\/div>");
NS 6+ (and W3) doesn't like a negative z-index. Take it out of the style sheet and the GIF will appear.
BTW, the flash will appear and work in NS 4 and NS 7. Why are you not displaying it for that browser?
beeready
11-18-2003, 10:26 AM
Okay, the problem that just didn't want to get solved still seems to be getting its way.
I took the z-index out completely since it shouldn't matter whether or not the flash is stacked over the gif at this point since they are both being written through js based on the browser type, correct?
I only had those in there because I was working on 'hidden' and 'visible'.
I changed the js in the html per your last post and now receive a completely error free report from the validator (Yea!!)
But, the gif is STILL not showing up in NS :(
The reason I want the gif in NS and the flash in IE is because NS doesn't do wmode and once everything else is in the page the flash background would make the rest of the page contents invisible. Unfortunately I don't believe anyone has come up with a way to make the browser make a .swf appear below any other page content.
I didn't know about NS not supporting wmode and did the silly little design for a friend of mine who owns a hair salon and once I found out that it wouldn't work in NS it was already too late because she really liked the 'eye-candy' and then it became this whole thing on my part that I WAS going to figure out some way to make it work in both NS and IE.
I put it back up at the same location:
http://www.salon1050.com/test.htm
Thank you so much for all your help with this!!!
Barrie
gil davis
11-18-2003, 10:51 AM
But, the gif is STILL not showing up in NSYour style3.css file *still* has the "z-index: -1" in it. That breaks NS 7.
beeready
11-18-2003, 11:09 AM
You're a genius!!!
Her server is funky and even though I had saved a version of style3.css and re-uploaded it, it wasn't overwriting the one living on the server.
I renamed the files and voila:
http://www.salon1050.com/test2.htm
I get the .swf in IE and the .gif in NS!!!
<barrie version of the snoopy supper dance>
Woo-hoo!!
Error free files that do what I want them to do!!!
<slurpy barrie/snoopy kisses>
You should get an award for patience and stick-to-itive-ness on this one! You absolutely have my heartfelt thanks!!!!!
Barrie
beeready
11-18-2003, 04:33 PM
Does Opera support document.all? If so is there another way to determine browser which doesn't use document.all? Because nothing at all shows up when I look at it in Opera which I think on my machine only has Flash 4 as I use it sometimes to test not only support for Opera but also to see if flash detect scripts are working.
Barrie