 |
| |
| Author |
Thread |
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-09-2000 06:53
What is the best way to make layers disappear in both ie and ns?
TIA
c0s
|
little osh
Bipolar (III) Inmate
From: Wales, UK
Insane since: Jun 2000
|
posted 08-09-2000 09:39
if (NN) document.<layname>.visibility = "hidden";
else if (IE)document.all.<layname>.style.visibility = "hidden";
osh
|
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-09-2000 09:40
sorry should have specified, onmouseout
|
Skaarjj
Maniac (V) Mad Scientist
From: :morF
Insane since: May 2000
|
posted 08-09-2000 14:30
HaHa!!! This one I think I know. In your <head></head> tags...make a javascript function called something like hide_layer. Put Little Osh's code in there. Later, in your body tags, call <A onMouseOut="hide_layer"> So that way, when you move your mouse out, it runs the hide_layer function.
What's mine is mine, and what's yours is mine to - First Rule of a Dictatorship
|
bitdamaged
Maniac (V) Mad Scientist
From: 100101010011 <-- right about here
Insane since: Mar 2000
|
posted 08-09-2000 18:18
hmm. I'm guessing from the onMouseout question that you may need a little clarification. Put this in your head:
<SCRIPT>
IE = (document.all) ? 1:0;
NN = (document.layers) ? 1:0;
/* This is modified a bit so that you can declare any layer you want to hide. YOu can also create a "showLayer" function using the exact same code only switching "hidden" to "visible" */
function hideLayer(name){
if (NN) {
eval('document.'+name+'.visibility = "hidden"');
}
else if (IE){
eval('document.all.'+name+'.style.visibility = "hidden"');
}
}
</SCRIPT>
Then in your body put this (I use DIVs instead of layers for cross-browser compatibility)
<DIV ID="layer1">
This is the layer you want to hide.
</DIV>
Then on the link you put this:
<a href="#" onMouseout="hideLayer('layer1')">
Mouseover me</a>
Then in the hideLayer function you can declare any layer you want to hide.
Walking the Earth like Kane
|
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-09-2000 18:27
Ok i will clarify it further (not real used to asking q's on messageboards :0)
ok i understand the whole hide layer concept and the whole mouse out on everything (imgs, divs, etc)
however, ns doesnt seem to recognize the onmouseout when it is inside the <div> ie does and it works great but how do make this work in ns?
thanks again
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 08-09-2000 19:36
May I add something to this?
The above code *will* work. However, one should know that in NN, the correct code is
blahblahblah.visibility = "hide";
rather than
blahblahblah.visibility = "hidden";
Similarly, one should use
blahblahblah.visibility = "show";
rather then
blahblahblah.visibility = "visible";
this is just in Netscape. Using "hidden" and "visible" *will* work, but when you test the value, you'll find that it's been replaced with "hide" and "show".
-----------------
Another thing:
The eval() function is not necessary there. Instead, you can say
if (NN) {
document[name].visibility = "hide";
}
else if (IE){
document.all[name].style.visibility = "hidden";
}
You see, myobject.myproperty is always equivalent to myobject["myproperty"]. I think that this makes simpler and easier to understand code.
|
little osh
Bipolar (III) Inmate
From: Wales, UK
Insane since: Jun 2000
|
posted 08-10-2000 05:45
Ah! You see c0s, we're all like computers in here. We give the answers to the questions that you ask - not to the questions that you think you ask!
The answer you are looking for is...
...well I don't know the answer actually. I've come across this problem myself, and can't remember ever solving it. (I'm a bit part-time at JavaScript thing, and just come here to look at other people's ideas, then nick them if they're good.)
You could try putting the whole <DIV> inside an <A> tag. My instincts tell me that you can't do that, but I don't know for sure!
Another method is this:
You can fetch the 'pixelLeft' and 'pixelTop' (whatever those are called in NN) values, and also fetch the width and height of the <DIV>. Then all you need to do is fetch the mouse events, and do the following.
if (mousex < pixelLeft | | mousex > pixelLeft+width | | mousey < pixelTop | | mousey > pixelTop+height)
{ make lay disappear; }
You never know. Some of my ideas sometimes even work!
osh
half this game is ninety percent mental...
|
bitdamaged
Maniac (V) Mad Scientist
From: 100101010011 <-- right about here
Insane since: Mar 2000
|
posted 08-10-2000 21:08
Whooo Hoo.. Many opinions heh.
Slime you are right about the eval tags. I don't use these as much anymore since I prefer using custom objects to take care of cross browser issues. Usually even for something simpler like this I will actually change my browser detect code to something like this:
ie = (document.all) 1:0;
styleObj = ''
docObj = 'document.'
if (ie) {
styleObj = '.style'
docObj = 'document.all.'
}
nn = (doucment.layers) 1:0;
Then I only write one line using the eval tags. This is a better solution on longer scripts.
However in regards to the hide/show deal. Whenever possible I try to use the same CSS property value in my scripts as in my style tags. Since this method works using hidden/visible in both the JS AND the CSS style properties it seems easier for folks to follow.
As to the DIV question. When IE parses a page it tries to do everything. that includes onMouseover events etc. NN does not. For NN you can only put onMouseover in anchor tags.
[This message has been edited by bitdamaged (edited 10-08-2000).]
|
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-10-2000 23:19
thx for the input, yea i know you guys cant read my mind and know what i am asking, that was my fault, sorry. hmm...well i spose i will study macromedia's site and that guy with the awesome jscript/dhtml tut to figure it out, cause it IS possible
c0s
|
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-11-2000 11:06
GOT IT!!!!!!!!!!!!! WOOOOOOOOOOOOOO HOOOOOOOOOOOOO
if anyone cares to know how, reply and i will post it.
c0s
i can finally go to bed (its 2:10am), i imagine the docs been up late like this a few nights :0)
|
little osh
Bipolar (III) Inmate
From: Wales, UK
Insane since: Jun 2000
|
posted 08-11-2000 13:35
Oh, go on , go on! Tell us. Go on. You know you want to... Go on.
osh
|
DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...
From: Stockholm, Sweden
Insane since: Mar 1994
|
posted 08-11-2000 19:24
Nah, we're not really interested, thanks anyway! (Just kidding, we're all dying to know, really!) As for the eval(...) controversy, Slime, I understand your position, it does look better, and seem to work fine, but! I can make the whole IE vs. NN thing work in just one line by decalring my style and all values first, and it really does come out to less lines of code. I likes less lines of code, stingy with the kilobytes I am!
Your pal, -doc-
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 08-11-2000 21:19
Ah, yes, but so can I! At the top of my scripts I usually put something like the following:
var IE = (document.all)?true:false;
var NN = (document.layers)?true:false;
var topstr = "top", leftstr = "left";
var visible = "show", hidden="hide";
if (IE)
{
topstr = "pixelTop"; leftstr = "pixelLeft";
visible = "visible"; hidden = "hidden";
}
I usually also put an onLoad function of some type with something like this inside of it:
if (IE)
{
layerone = document.all.layerone.style;
layertwo = document.all.layertwo.style;
}
else if (NN)
{
layerone = document.layerone;
layertwo = document.layertwo;
}
Then I can simply say
layerone[topstr] = 500;
layertwo.visibility = hidden;
The only complication is a slight use of object references! I suppose if I have 200 layers to deal with, and I can't use a for loop to deal with them, then your way may be more efficient. But I still say I'm right. =D Hee hee!
- Slime
|
DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...
From: Stockholm, Sweden
Insane since: Mar 1994
|
posted 08-11-2000 23:42
Hah! You may well be, my friend. I was explaining to Malin how I got started with first Photoshop, and later Javascript. When I was starting out, I wanted to do cool things, and nobody knew how! So I learned, with no formal book learning, making for some elegant and atrocious hacks that worked. When I started dealing with programmers who knew the real deal, they were impressed by what I could do, but horrified at the look and feel of my code! Didn't I ever indent? What am I *thinking*, no indents, hrmph! The funny thing is, if I had gotten into this thing 2 years later than I did I might never have bothered learning it at all, and ooh-ed and ah-ed at folks like you with the rest of 'em! What a strange path we follow, I like it.
Personally, I still like the eval() statement, a great way to cheat and smush a whole bunch of different kinds of stuff together, and have it parse! Other than esthetic reasons, can you come up with any good arguments to help me mend my ways? I warn you in advance, I can be a cranky old man about things sometimes! <img border=0 align=absmiddle src="http://www.ozones.com/forum/biggrin.gif">
Your pal, -doc-
|
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-11-2000 23:42
ok here it is (i had to clean it up a bit because last night it was just "working")
i put this in a .js file and include it at the bottom of the page (right above the </body>
//track mouse
window.onerror=null;
netscape = (document.layers) ? 1:0;
goodIE = (document.all) ? 1:0;
docObj = (netscape)?'document.':'document.all.';
divObj = eval(docObj + ((netscape)?'layers':'tags(\'DIV\')'));
styleObj = (netscape)?'':'style.';
idObj = (netscape)?'':'id.style.';
clipObj = (netscape)?'clip.':'';
widthObj = (netscape)?'width':'pixelWidth';
heightObj = (netscape)?'height':'pixelHeight';
leftObj = (netscape)?'left':'pixelLeft';
topObj = (netscape)?'top':'pixelTop';
var mX,mY;
document.onmousemove = MouseMove;
if (netscape){
window.captureEvents(Event.MOUSEMOVE);
window.onMouseMove = MouseMove;
}
for (i=0;i<divObj.length;i++){
if (divObj[i].id != ''){
eval("var " + divObj[i].id + "_show = false" + ((netscape)?"":";"));
eval("var " + divObj[i].id + "_hide = false" + ((netscape)?"":";"));
}
}
function MouseMove(e){
mX = (goodIE)?event.x:e.pageX;
mY = (goodIE)?event.y:e.pageY;
var i,docObj,left,right,top,bottom,doc;
for (i=0;i<divObj.length;i++){
if (divObj[i].id != ''){
if(eval(divObj[i].id + "_show")){
left = eval('divObj[i].' + styleObj + leftObj);
top = eval('divObj[i].' + styleObj + topObj);
right=left + eval('divObj[i].' + styleObj + clipObj + widthObj);
bottom = top + eval('divObj[i].' + styleObj + clipObj + heightObj);
if((mX<left | | mX>right) | | (mY<top-14| |mY>bottom)){
eval(divObj[i].id + "_show = false");
hideLayer(divObj[i].id);
}
}
}
}
}
function showLayer(L){
eval(docObj + L + '.' + styleObj + 'visibility = ' + ((netscape)?'\'show\'':'\'visible\''));
eval(L + '_show = true');
}
function hideLayer(L){
eval(docObj + L + '.' + styleObj + 'visibility = ' + ((netscape)?'\'hide\'':'\'hidden\''));
}
|
DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...
From: Stockholm, Sweden
Insane since: Mar 1994
|
posted 08-11-2000 23:43
Actually, just reading some of your explanations and such, I've already borrowed some of the concepts and adopted them into my arsenal. I likes new tricks. 
Your pal, -doc-
|
c0s
Nervous Wreck (II) Inmate
From:
Insane since: Apr 2000
|
posted 08-12-2000 00:02
doc> i was feeling pretty blessed to be able to figure this out and now hearing that well, all i can say is i have admired you for so long and to hear you even used one line or even concepts of what i have done just thrills me :0)
c0s
[This message has been edited by c0s (edited 12-08-2000).]
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 08-12-2000 01:52
Hah, no, I'll leave it at that, Doc. =)
The thing that I like about JavaScript is that it doesn't care about variable "types" and stuff like that. It figures out what you *mean* when you tell it things, most of the time. It does most of the dirty work behind the scenes. It would barely work for writing real computer programs, but it's very convenient for what we do.
|
bitdamaged
Maniac (V) Mad Scientist
From: 100101010011 <-- right about here
Insane since: Mar 2000
|
posted 08-12-2000 05:13
Actually though Slime even you code would benefit from the eval statement.
If you put the docObj and styleObj code in with your browser detect statement then where you have:
if (IE)
{
layerone = document.all.layerone.style;
layertwo = document.all.layertwo.style;
}
else if (NN)
{
layerone = document.layerone;
layertwo = document.layertwo;
}
you can replace with this
latyerone = eval(docObj + 'layerone' + styleObj)
if you have 10 layers with your statement you have just cut your code in half
Walking the Earth like Kane
|
Slime
Lunatic (VI) Mad Scientist
From: Massachusetts, USA
Insane since: Mar 2000
|
posted 08-13-2000 17:53
True, I would assume that when you use an empty string, document[""], there might be some sort of error. And I'm not sure you can do document["all.mylayer"].style either, you would probably have to use document["all"]["mylayer"].style instead. So there are places where this doesn't work.
The eval function is also useful for user input. If you want the user to enter a number, then say
var mynum = eval(prompt("enter a number:", "0"));
Then they can enter either a regular number "50" or something with JavaScript code: "40 + 20 - 10". catch that?
|
