Home › Forums › JavaScript › Hide/Show Div's
- This topic is empty.
-
AuthorPosts
-
August 22, 2013 at 11:42 am #147863
TWG
ParticipantI have some code, http://jsfiddle.net/maddtechwf/nmkB8/3/ , that I need some help with.
I need to have a div show based on prev/next buttons. I need all the divs to be hidden except for the active one until the next/prev button is pressed and the corresponding div is shown.
Right now all my divs show.
August 22, 2013 at 1:05 pm #147886srikarg
Participant@Maddtechwf I’m not sure if you mind using jQuery for this, but that’s what I used…Here’s a link to my solution: http://codepen.io/srig99/full/vgKbd.
August 26, 2013 at 12:42 pm #148180TWG
Participant@srig99 – That worked perfectly. Thank you for the help. I really appreciate it.
I have been told by users that the div’s are not hiding in IE8. Any ideas why?
August 26, 2013 at 8:25 pm #148191g3logic
ParticipantI have found the not() doesn’t work properly in IE8 properly. Since you are using not() to select the inactive div’s, I believe that could be your problem.
There are a bunch of different ways you can achieve what you are trying to do without using not()… although, not() would be my first choice if not for IE8. One way would be to add an additional class to all of the divs for the sole purpose of selecting them for the fade. Something like inactiveDiv. And then remove that class from the active div before fading. Since the active div no longer has that class, it won’t fade… only the others will. Then when you move on to the next, restore that class name to the div that you had removed it from.
Make sense?
August 26, 2013 at 8:57 pm #148194TWG
Participant@g3logic – I get what your saying. I’m not that good at jquery. Would you mind helping me a little more?
August 26, 2013 at 9:35 pm #148197g3logic
ParticipantDoh! Just realized that you’re only using not() to hide the divs initially (been a long day… sorry). So is the problem that the divs are not hiding initially in IE8? Or are they not fading out when you click Next?
August 26, 2013 at 9:43 pm #148198TWG
ParticipantThe div’s don’t hide initially but when I click next, the next button doesn’t work either.
August 26, 2013 at 9:55 pm #148199g3logic
ParticipantOK, I’m referencing the CodePen solution. Try this:
Remove this line:
slides.not(slides.eq(current)).hide();And replace with these two lines:
slides.hide();
slides.eq(current).show();August 27, 2013 at 7:10 am #148226TWG
ParticipantOkay, so I changed that line for the two lines you provided and my div’s still all show on one page. Do I need to do your original suggestion with the intactiveDiv class?
August 27, 2013 at 12:23 pm #148268srikarg
ParticipantWow, I didn’t get notifications for this post these past few days, so sorry for the late reply. Anyways, I tried using classes to make a different version that might work for IE8 (stupid IE always causing problems :P). Can you try this and get back to me? I can’t test it in IE as I am using a Mac. Here’s the link: http://codepen.io/srig99/pen/itxrG.
August 27, 2013 at 12:30 pm #148269TWG
ParticipantWhen I run it in IE, it does the exact same thing as before.
August 27, 2013 at 12:31 pm #148270srikarg
Participant@Maddtechwf Ok, I’ll try something else then.
August 27, 2013 at 12:33 pm #148271srikarg
Participant@Maddtechwf Can you tell me if there are any errors in the JavaScript Console in IE8? Is it possible for you to post a screenshot here? Thanks.
August 27, 2013 at 12:51 pm #148272g3logic
ParticipantJust tried to view in IE8 and CodePen errors out, so I can’t see the code you’re using.
Can you post a version to your web server?
August 27, 2013 at 12:56 pm #148273 -
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.