I just spent way too long realizing that by setting the boundary property for Twitter Bootstrap popover Javascript to viewport (I believe it's parent element by default), it gets rid of the flickering issue I was having with popovers triggered on hover. If anyone else is having that problem, this fixes it. :)

data-toggle: popover
data-container: body
data-boundary: viewport
data-trigger: hover focus
rproffitt commented: Excellent. That flickering was showing for me a lot. Thank you, thank you, thank you. +0

Recommended Answers

All 7 Replies

Thanks for this fix.

However. (You knew this would happen.)

Look at https://www.daniweb.com/programming/web-development/threads/451966/how-to-create-pdf-report-in-php#post2257830 and the popover is uncalled for since there is nothing to show. Picture:
ThumbshotDani.png

This rather huge popover may be of interest when you are developing but here it's a distraction, questions why it is even trying and blocks you from reading what is there.

On top of that I have to use Control+Click on the link to get the link in a new tab which is fine until you see this popover won't die when the mouse is moved off the link. The popover sticks around like a zombie until I click on the screen.

Suggestion: Don't pop if "Thumbshot Not Available."

commented: True +0

Having the popover display even when a thumbshot is unavailable has been the way it has been for 10+ years. The reason is because there is no easy way to test whether a screenshot is available or not for a given link until we go ahead and try it.

However, as I'm typing this, I actually thought of a way that just might work. Stay tuned :)

We've been displaying thumbshot popups for years and years. We used to outsource to Thumbshots.com where we would have to pay per image. That meant that when you'd hover over a link, it would fetch the thumbshot from the third-party server. If no thumbshot was available, Thumbshots.com would have a little graphic indicating as such as the graphic that it showed.

However, nearly a decade ago, we switched to generating our own thumbshots in house. We now can see in the database whether a thumbshot is generated / available or not. However, I just continued to use it the same way we always have, generating our own error message graphic the way Thumbshots does. I considered not showing a thumbshot if one wasn't available, but how would you know if one was available or not without trying?

It just came to me now that, for the last few years, we do a database lookup on each page to find out the last known status of all the links on the page so that we can put a strikethrough through what we believe are dead links. I was able to tap into that existing query to also pull whether a thumbshot is available for each link without taking any performance hit.

Thanks for the insight and most of all your time fixing all the little (and big) things.

Nice post

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.