Our campaign will utimately have a TON of NPCs in the Characters section, and I think it would be awesome if you could see the stored avatar image of the character when you hover over their link from the Adventure Log (or anywhere else really). Is that a feature someone has already solved for? I searched the forums but I'm not seeing it.
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
That's an interesting feature that would be handy if it was implemented. As for how to accomplish it with CSS, I would have to play around with it a bit. I feel like you would need to adde a :before or :after element to the links that is hidden away, then have it displayed when :hover is used. It can be done with individual customized CSS coding for every player/NPC that gets called out in the inline text...but I do not know how to make it where a single CSS code can apply to each character.
Maybe with some form of wildcard that is automatically populated with the character slug that is nested in the brackets? I will play around with this on my test CSS page and see how far down the CSS rabbit hole I can go.
Awesome thank you gastoff - appreciate your time and thoughtful response!
Good news: I was able to figure some CSS to make an image preview on hover work: https://csstestcampaign.obsidianportal.com/adventure-log/test-entry
Bad news: Each one has to have unique inline HTML to make it work. Hopefully someone with more CSS knowledge can come along and show a way to make it work with minimal HTML shenanigans.
The Custom CSS:
With the CSS above in place in your Custom CSS area, you would then need to make your inline entry follow the following format:
<a class="thumbnail" href="URL of character page">LINK TEXT<span><img src="URL of Character Image" /></span></a>
If feel like there should be a way to make the HTML pull in the URL information by looking at the page slug:
<a class="thumbnail"> [[character-slug | Character ]] </a>
and somehow get it to apply the span CSS...but I have no idea how to get that to work.
Awesome - great start gastoff! Hopefully someone will jump in and add to this. Seems like there are lots of smart people on this forum.
Ok that is cool and could be very useful for popping up all sorts of images.
-Jaymes
Campaign of the Month Febuary 2013
This is awesome. I'm using it already HERE in Shadows and will slowly, but surely, be redoing every synopsis, starting with season 4 (the current one) then the other previous seasons, with this.
Thank you
Yeah this is super cool. Wow @Keryth987! Your "Shadows" campaign is awesome!
And @gastoff, I'm going to do what Keryth987 did and use your code throughout my campaign too. I've also submitted as a feature request because I think it would be low lift for the devs to add this to the default functionality offered by the Character Link button. But since I'm impatient, and appreciate the time you spent, I'm going to use your version in the meantime.
Appreciate you both!
@Gomez Thanks. Put alot of work into Shadows.
THIS NEEDS TO BE STICKIED
I added some code to make this work on OP as a beta feature. The details are over in the Feature Request thread for this feature:
https://forums.obsidianportal.com/discussion/5510/cause-thumbnail-to-appear-when-hovering-over-linked-character-name#latest
Obsidian Portal Developer
Wow thank you @thaen! I'll give this a whirl today!