Popup image on hover over set number links

Not a fan of the auto-dark mode feature, find it harder to read than the standard white mode.

LOVE THIS

As a wise old man once said: "Hover on, hover off". Well, something like that. Anyway, the lack of an auto-dismiss makes this a somewhat annoying feature. As mentioned above, if you accidentally linger over a hyperlink then you'll get the image whether or not you want it.

Also, dark mode now seems to be persistent, regardless of how often you turn it off and regardless of how many devices you use to do so! Could be a case of clearing cache or cookies to rectify it, but in the meantime it's an irritating niggle.

Honestly, some people are just never happy....

Concur with previous comments. Previews occur too quickly, should disappear when moving the cursor from the hyperlink. They should also be somewhat smaller, and - chiefly - the same size regardless of how large the image on the size is.

Great work nevertheless Huw, Brickset is one of my favorite sites on the web!

Hey, nice changes! I noticed that in dark mode, part lists contain light ">>" icons in every row of the dable and it looks a little bit strange for me. Other than that, I really like all these new features, great work!

Thanks for this, Huw. Very useful. It's however not working on the Amazon links posted by Huwbot, at least not in Safari. If I hover on those links, I see on the status bar the full link to Amazon, but not a popup image.

Oh wow, the updated version literally came into play just as I was browsing; I was so surprised to see that it was suddenly working differently to how it had a few moments before! But it's fantastic, I really like the changes ^^

Thanks so much, Huw :D It's really helpful to be able to see the sets that are being referred to in comments; I can't even remember how many times I've had to go up to the search, before now, to see what people are talking about!

Love it!

A fantastic addition, thank you.

This is a game changer; and much appreciated.

Nice! Hope to have this for links to parts too.

Tried it on the three links above and every tenth picture seems to freeze and won't go away, even after scrolling up and down.

Looks great Huw!

This is fantastic Huw.

If I may make an additional suggestion - I think that once the pop-up appears, if I decide to hover my mouse within the pop-up image, I would like to be able to click on either the image to take me directly to its Brickset page, or on any of the associated links that appear below eg Classic Space, etc.

Currently it closes as soon as you move your mouse off the number, which is great, but if I do actually want to continue my LEGO rabbit hole through the pop-up, it would be handy for it to stay open as long as my cursor is within it.

Very useful feature.
And you already solved the automatically close and smaller pics requests...
I really appreciate it :)

Minor comment:
For me (with Chrome 85.0.4183.121) sometimes the pop-up dows not close automatically and in this case multiple pop-ups may appear (its seems that it connected to mouse wheel scrolling, but not all the time). In this case I can close it with go over the corresponding link again. But it occurs only around 5-10% of the cases.

Nice changes. The dark mode is beautiful, but when i put cursor on upper user menu (login,etc.), white rectangle pop up above it.

The popup feature is so nice!

Hi Huw,

This is great! Can we have it on the forums too?

thank you!

Great update, the hover is perfect now. Thanks Huw!

Is there anyway to turn off auto-dark mode without turning off my device's dark mode? I prefer to use light mode on Brickset

A really nice feature – thanks!
But Dark Mode is now forced upon me every time I refresh/click to a different Brickset page (Firefox on Macbook).

The heading "In The News" would be nicer if it were white; it's a dark grey for me, and it kind of disappears.

Awesome new addition! Thanks, Huw!!

Thank you so much for implementing this Huw!! It looks wonderful! Your hard work and dedication to this site are so evident and so appreciated!

Unfortunately some of the popups don't disappear. Win10 + Chrome.
Might be caused by moving the mouse pointer over multiple set numbers in quick succession (though haven't got a definite method to reproduce it).

This is a great addition to an already great website!

It looks like there have been some issues reported/fixed/reported already. However, this feature (which I like) still seems to behave a little bit inconsistently for me. I'm using Firefox 81.0 (64-bit) on Ubuntu 18.04 (Bionic Beaver).

If I hover over a set number link, I see the popup correctly. Then when I move my mouse away from the link it disappears immediately. I believe that this is the desire behaviour.

However, when I quickly move my mouse over a link, say from top-to-bottom, then the pop-up will appear and remain. It will not close until I hover over the link again, keep the mouse there for a second, and then move the mouse away slowly. If you find that these steps are unclear or not reproducible, I can send you a short video to demonstrate what I am observing.

Edit: I just tested Google Chrome 85.0.4183.121 on the same platform. The behaviour is identical.

At last!

Very neat and useful feature.

This is fantastic, it will be so much easier to reference sets and see what sets are being referenced this way.

Thanks for implementing this great feature!

What a handy feature. So simple. Saves having to open multiple tabs to compare sets that are being discussed without losing the original page.

Thanks @Huw!

Thanks for the update.

Love the pics in the newest review of set 375. Yellow castle is one of my favorites and I've never seen good pics of that alternate build before. Looks great and I'm definitely going to convert one of my 3 to that one.

Thanks for such a quick update, this is perfect now! I love the fact that the pictures are now smaller as well.

Testing: 6934

Just writing this to see if it works in the comments. Two of my favorite sets are 10197 and 10243

@Squicman @shikadi, it works!

657

Great work Huw!

Awesome! Now when someone mentions that, for instance, their favorite set of all time is 6931 , it'll be that much easier to know what they're talking about!

Note: for me, directly after making that comment, the feature didn't work--it became a link, but the hover-over pop-up did not work. All others on the page did. Refreshing the page fixed mine. If it's any help, using latest Firefox on Mac OS. It may be expected behavior and not necessarily need fixing.

Now I have edited my comment on the Swiss canister to enable the hyperlink.
It is really a great feature and will make use in the future.
Many thanks to you @Huw

I have no understanding of computerprogramming and have no idea how difficult of a task this was for you, but this is once again a great functionality which has been added to the site and it is highly appreciated. Thank you for bringing us this wonderful site with ever expanding features and giving your time and efforts to the world.

This is amazing! I'm one of those people who can't remember what number (or name!) belongs to what set, so this is super convenient. Thanks for the awesome update!

This is f*cking brilliant! Thanks a lot!

Amazing! Thank you for the suggestion and for implementing it.

Great work Huw - really appreciate the agile turnover of this feature. Works like a charm for me now!

regarding touch-devices: problem is that there is no "hover" state on them, and a Long-Press is a simulated hover but also calls the context menu, therefor you have to discard that to see the popup. most of the times we (an interface design company) avoid hover dependent interactions by now and try to find a consistent and good solution without them.

I this case though, the swiftness of just hovering is actually good to "just have a fast look" on devices that support that.
on devices that don't, one could implement a different kind of behaviour, so that once a touch device is detected, the behaviour changes to: one tap means to open the popup, the second tap follows the link to the set.
for new users this is somewhat intuitive as long as the popup tells somehow that another tap will lead to the previewed set. returning users that got used to the feature will have learned that tapping once just shows a preview, while "double-tapping" (actually just do that second tap so fast the popup is not really visible any more) leads them to the set defacto immediately.

this might be one of the cases where it is harder to do such things if using some jQuery plugin and having to configure or tweak it until it works, compared to writing your own custom javascript- or jquery-behavior from scratch ...

I'm still having issues in Firefox with popups not disappearing, but I'm unable to get the same unwanted result from all the examples on the jQuery UI examples pages.

I love the feature, though!

A long press on an iPad shows the set image but also displays a preview of the page the link will go to (standard Safari behaviour). I feel showing both would get annoying, so would prefer one or the other.

A solution on this page seems to prevent the standard Safari long press behaviour: https://stackoverflow.com/questions/12304012/preventing-default-context-menu-on-longpress-longclick-in-mobile-safari-ipad

The gradient background is an improvement, but I still think the staff comment yellow highlight doesn't look too great. Edit: My own comment's red looks better than before tho, so good job

@Huw:
I’ve got my iPod Touch set to run in nighttime mode, and I’m still not getting auto-dark here whether I’m logged in or not.

I love the idea of this pop up, but it does not work in chrome for iOS. I pretty much only ever visit this site on my phone, and I only ever use chrome. I imagine that I can’t be alone in doing so.

May I suggest that instead of a hover, when the user clicks (taps) on the link it opens up a “quick preview” which is common on many e-commerce sites. Clicking (tapping) outside the preview would close it, while clicking (tapping) inside the preview would take you to that sets full page.

I feel like this would be a very intuitive interface for smart phone users, and may even be preferable for PC users as well as it won’t be dependent on your mouse continuing to hover.

YES! Finally!!! Thanks a lot Huw (and Huwbot)!

@Huw said:
" @HDanke , is your device set to dark/night mode? It should only 'auto-dark' in such circumstances."
Yup, i prefer dark mode but i find that brickset's is too hard on my eyes (text too bright and the contrast is a little much). Nice that there's an option to disable auto-dark now.

Dark mode issue seems to be solved – thanks!

@Huw said:
"^ The text is deliberately not white, but there needs to be enough contrast to everyone can read it, so I don't think we can tone it down any more."

Yeah it's understandable, for dark mode implementations i think the way chrome and discord do it is pretty good, haven't seen anyone complain about the color balance on those two.

I do like the feature, however it isn't so good on mobile. Since the hover event cannot be reliably replicated on touch-screens and since the set number is a link to the set, it would be better to add a separate 'link' (such as an icon, properly tap-spaced) so that the unique action reveals the content that is dismissable. The additional content can remain in the flow of the document and be 'opened' on request That will be consistent and work on almost all devices. Hope it helps :)

How do you 'activate' that pop up image for sets?
When I try with the examples above it works.
But if I try it on the numbers in my review(s) (e.g. https://brickset.com/reviews/55945) nothing happens.

Huw, you continue to amaze. This might be my favorite new feature yet!

Really liking the hover/link gizmo, I find it really useful especially on the Amazon discounts to save going to the item page.

Still getting random examples that fail to close after I move the cursor away.

@Huw:
I'm pretty sure the iPod Touch runs on Cookie Monster OS, as cookies last about as long as you maintain constant vigilance, and then they vanish in a puff of crumbs. I've tried clicking the box to stay logged in, and every time I open Brickset, I'm logged out. For this, I'm looking at three different functions that should cover this between them:

1. Do Not Disturb. Has an icon shaped like a crescent moon, and just silences notifications because I can't receive calls anyways. Manually engaged.
2. Bedtime. Scheduled form of above, also dims the lock screen.
3. Night Shift. Scheduled feature under Display & Brightness that causes your screen to shift towards the warmer spectrum.

What a thing of hover-over beauty :o)

Many thanks for your efforts.

This is great! Thanks!

btw, the amazon price watches only work with the highlight set on the homepage, when you click the category, it doesn't work for me, not sure if you're aware? ( like https://brickset.com/news/category-Amazon-de-watch )

Hate it. Don't need or want it. The pop-up gets stuck "open" and I have to reload the page. Images popping up as I just move my mouse across links. There needs to be an option to disable this for users. Is there? Did I miss the option?

@Huw said:
" @TWP said:
"This is great! Thanks!

btw, the amazon price watches only work with the highlight set on the homepage, when you click the category, it doesn't work for me, not sure if you're aware? ( like https://brickset.com/news/category-Amazon-de-watch )"

No it doesn't work on /news/ pages but I'll make it do.

It works on e.g. https://brickset.com/article/54149/discounts-at-amazon-de
"

that's great, thank you!!

While this is a neat feature, it's rather hit-n-miss at my end. Way too often the popups gets stuck without any way to close them, particularly if there's many numbers near each other (like the "What's hot" list) - if I mouse over a second link before the first closes they often both gets stuck open. There needs to be a way to close them manually, for instance by clicking on or outside the picture.

IMO the fundamental problem is that there's no "hard" way to close popups built into the browser, I believe there are add-ons that can do this but I haven't tested them. Sometimes it works with "inspect element" but it's rather fiddly (and requires some HTML knowledge), it really should be just to right-click and select "close this pop-up" or "block this pop-up".