Good call, made it an icon. FYI it’s only seen on hover for desktop.
I’ve added a 0.2 second delay, which I do think helps a lot. I did put on a max heigh for extreme cases, but I don’t think it’ll make a big impact for you? I do want it big enough to give a healthy description.
Fixed this issue as well. TBH, I’m only showing the first 4 lines now on mobile, which I think is a reasonable compromise.
It was an issue for movies without any blurb / description from TMDB. That situation is quite rare and my handling for that situation was apparently broken.
Unfortunately if I don’t put that level tag at the edge the box as in the original image, it looks stranger… the level tag seems kinda lost and not aligned.
Would it? Netflix has that functionality in their UI, and it doesn’t seem disruptive there. The only difference is their popup is centered, rather than appearing to the right/left (I think that’s actually more relevant to the disruptiveness).
Admittedly, Netflix follows the thumbnail-only approach, with very large thumbnails.
I’m not following. How does having translations address this? Are you saying the interaction would be hover over image → English translation of title is shown with other info (does that include the original JP title)?
The benefit to using Yomichan isn’t translation, it’s reading(s) + dictionary + kanji info (which yes you can piece into a translation). Particularly in this context, I don’t really care what かがみの孤城translates/localizes to, if I can’t even figure out how read the characters. Also how would untranslated works factor into this?
Ok! As the inline levels seemed more popular, I went with Version 2!
I’m honestly not even sure how you are able to get them on your phone
It should be fixed now though? At least the width shouldn’t overflow the screen
Yeah I wasn’t sure how to do this cleanly on my initial take.
I think it’s very hard to do well and something I’m probably not inclined to spend time on. A hover over expander like Netflix is a bit different too than the fly out that we have… mainly because with the fly out you are explicitly not hovering over the fly out, whereas in the Netflix expander you are hovering over the expanded content.
If I were to allow you to move your cursor into the flyout, I have to be very certain you’re intending to move it into the fly out and not simply somewhere else. This is especially tricky for rows of images as the fly out is either on the left or right so you may just be moving your cursor to the next item. An expander solves that situation elegantly, but then again isn’t as flexible - you aren’t able to have an expander on text content, only image.
You’re welcome to open a product request though! But yeah it’s not a straightforward issue I don’t think, at least on first glance
I definitely prefer the way you have it. As I said, I already find them somewhat intrusive, but at least they don’t interfere with the rest of the UI, just block it visibly. If moving the cursor over the flyout kept the flyout open it would become even harder to navigate the page.
Android: Just put your browser in desktop mode, long press, back out of the pop-up menu.
Btw is it intentional that I’m Watching/Reading on the dashboard doesn’t have the hover functionality?
I see your point re: the difficulty implementing. I’ve had that issue with nav menus before, now that I think about it. I think I’ll let it rest for now.
Just curious though, why wouldn’t an expander work on text? At the very least, you could put the ::hover property in the css (or js?) on the parent element, and it would cover both, no?
Interesting. In Chrome I had to set it, but in Firefox it works the way you’re describing. The behavior on Firefox is weird tho… Like it snaps up and down vertically in response to scrolling, for a little.
I guess Firefox sends a hover event when you long press things or something