Jump to content

I need some advice


djp1988
 Share

Recommended Posts

Here is what I would like to end up with:I have some links say as a navigation, when a link is clicked, the corresponding div with the relevent info is firstly switched from display:non to block and then faded in up to opacity 100, So I thought to myself, I must set say all 4 of my divs as display none, and when the page loads, I should also make these invisible divs opacity 0, when the person clicks the link, I triger a script that changes the display of the relevent div to block and a small interval allows a fade in effect, so I distinguish 4 phases:1) div at display:none2) div at display:none and opacity set to 03) div at display:block, but opacity still 04) div at display:block and opacity 1But as I have more then one div, I tried to use document.getElementByClass('myclassname') and it seems this may be causing me problems and I don't know in which direction I am pointing!Actually even with getElementsById I can't seem to put my finger on it...

Link to comment
Share on other sites

I would set the display to none and opacity to 0 using CSS for the ones I don't want to display right away, then use links (using the onclick event) to load a function that gets the corresponding div by id (I typically always use id with JavaScript because I seem to always have problem with class and name) and make sure that the display is set to block FIRST and then bring the opacity up AFTER the display is set. Order is important. Also make sure that the function will only affect one element at a time. Typically if the function will affect more than one element at a time, there will be problems.

Link to comment
Share on other sites

Advice. You're trying a lot of stuff here on a bunch of different things. Build it from the ground up. Start with one div and access it by ID. That always works. Now, write a little routine that just plays with opacity. Set the opacity to 0 in CSS (you know you have to accomodate several ways of doing that, right?) and then bring it up at onload, like you said.Once you've mastered the opacity thing, move on to the display thing.BUT. What's up with the display thing? Why is it even here? 0 opacity should make the thing invisible, but display: none does MORE than make a thing invisible. It makes it GONE. It takes up zero SPACE. Making a thing go from GONE to HERE, even if it's invisible, is going to be weird at onload. Any other visible elements below it are going to suddenly change position. Do you want that, or are you just trying to get an invisbility effect because something else wasn't working?

Link to comment
Share on other sites

Hi, well I want display:none because I want the div's to load in the same space when called, so i toggle from display non to block for the desired one

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...