• 0

Can you help? JS tool-tip stuck in "hidden overflow" from CSS


Question

Hello fellow Neowinians!! So... I have a caption bar that slides into the thumbnail on hover with 2 links inside. Then, when you hover over each link inside the caption bar it gives you a "tool tip" of type of info inside the links.

Because of the animation for the caption bar I had to use overflow:hidden; which is effecting the tooltip also.

I stripped away most of the site so it would be easier to look at the code.

Here is a link to my problem: portalpacific.co/test/
Hover over the thumb to see.

Also heres it zipped up if you prefer: portalpacific.co/test.rar

I broke the links because they were adding an A to the end for some reason and going to invalid page So please just copy and paste.

 

Anyone got the answer? :3

 

Lots of tytytyty!

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

I found this but not sure how to apply it.. :(
 

var parentElement = tooltipElement.parentNode;  
                         parentElement.style.overflow = "both";
Link to comment
Share on other sites

  • 0

Adding above mentioned code in "tipr.js" file makes no tooltip on hover... It disable completely. If this is your desired behavior, then simply add this to tipr.js file.

Link to comment
Share on other sites

  • 0

Adding above mentioned code in "tipr.js" file makes no tooltip on hover... It disable completely. If this is your desired behavior, then simply add this to tipr.js file.

I guess i misunderstood the original stack overflow post i got that code from. I'm still where i started so if you know the answer that be great. I think we both know that isn't my desired effect. lol

 

There must be a way to override the hidden overflow for the js tooltip. 

Link to comment
Share on other sites

  • 0

It's complicated.

To fix this you must put the animated item into a a seperate overflow div from the tooltip. But this prevents you from putting the tooltip in the horizontal center of the tag :/

 

Simply said, if you remove the overflow that clips the popup you also rmeove the overflow that clips the tooltip. 

 

I'll make a hacky fix tommorow.

  • Like 1
Link to comment
Share on other sites

  • 0

It's complicated.

To fix this you must put the animated item into a a seperate overflow div from the tooltip. But this prevents you from putting the tooltip in the horizontal center of the tag :/

 

Simply said, if you remove the overflow that clips the popup you also rmeove the overflow that clips the tooltip. 

 

I'll make a hacky fix tommorow.

Lol! Sometimes i dont come here for a while and when im back needing help BOOM there you are Seahorse! I think im gana play with it a bit more though ill let you know by tonight if i have been successful or not so you dont waste any of that amazing brain power for no reason!

Thanks!! :D 

Link to comment
Share on other sites

This topic is now closed to further replies.