I just added a parallax to this site and since then the tabs ( jscript ) have stopped working. I think it maybe to do with the z-index but I can't find out what or where it should go. I've tried in a few places but no joy.
Any ideas?
| SitePoint Sponsor |



I just added a parallax to this site and since then the tabs ( jscript ) have stopped working. I think it maybe to do with the z-index but I can't find out what or where it should go. I've tried in a few places but no joy.
Any ideas?
I learnt design from Ben Hunt's Pro Web Design Course
For For Women In Business
For Home School Education in Wales


The tabs seem to be working for me. Is this a specific browser issue or am I looking at the wrong thing?
www.pmob.co.uk CSS FAQ 3 col demo Read My CSS Articles
Ultimate CSS Reference
Check out SitePoint's latest JavaScript challenge

hantaah, I can't really tell what is not working. Almost everything seems to function "as expected" in Firefox. The :hover background-color in the Gallery drop downs is a little wide, but that's all I see. What browser are you using? You may need to post screen shots comparing the expected/desired behavior to the "bad" behavior.



yea I managed to get the tabs working - it was to do with the z-index however the problem is still on the gallery. It does not jump when you hover over it or show the enlarge or view symbols but the very last one does see here: http://www.organicwebdesigns.co.uk/html-emails/
I learnt design from Ben Hunt's Pro Web Design Course
For For Women In Business
For Home School Education in Wales


I'm sure we've been here before, but you've got several versions of the jquery library on that page, where you should only have one, and the fancybox script comes before the library, rather than after it, in the source order. Anything that depends on jquery must come after the library in the source order.


HI,
For z-index to work the element needs to be positioned. Your wrapper is under the background above and therefore the elements are not clickable.
Add this:
You should address the problems Ralph pointed out anywayCode:#wrapper2 { position: relative; z-index: 6; }![]()
www.pmob.co.uk CSS FAQ 3 col demo Read My CSS Articles
Ultimate CSS Reference
Check out SitePoint's latest JavaScript challenge



I guess I'm shying away from the issues ralph has mentioned as I just can't seem to find what I need to fix it. I can see the issues on the source code but I can't find it in the php files in wordpress. I've looked in header.php but I can only see one link for jquery but that about it.
I put the wrapper code and that's sorted it otherwise confused.com on the other issues. Also I was wondering why it doesn't work when locating the wrapper id and adding the possition: relative yet adding all your code seperatly to the bottom of the sheet works.
I learnt design from Ben Hunt's Pro Web Design Course
For For Women In Business
For Home School Education in Wales


How did you add things like fancybox and the parallax code to your pages? I guess you need to dig in to those parts and tell them what to insert and what not to.
I may have been wrong in something I sadi earlier: I can't see the fancybox script above the first jQuery file now. Either it's gone now, or I mistook the fancybox CSS file for a JS file. Sorry about that.


www.pmob.co.uk CSS FAQ 3 col demo Read My CSS Articles
Ultimate CSS Reference
Check out SitePoint's latest JavaScript challenge
Bookmarks