nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to create a pop up graphic similar to a hover pop up graphic?

Kevin Shanahan

I want to be able to hover/or click a link and have a graphic pop up within the same window/page that I am on.

Accepted answers

All comments

William Zanchet

Hey Kevin,

Is this a third party plugin that has those graphic? If yes, you might want to reach out the vendor to see if there's an improvement request that you can fill in to have this feature.

Cheers,
WZ

Milo Test

If you're using Confluence server, try this:

Remove the word or phrase that will be the target of the rollover
Add the Rollover macro
Edit the Rollover macro and put something unique in the Class field (e.g. image1)
Put the Span macro in its body
(The Span macro forces it to be inline)
Add the CSS Stylesheet macro

Enter the following:

.image1:before {
content:"rollover";
color: blue;
text-decoration: underline;
}
.image1-rollover:after {
content:url(http://path.to.image/image.jpg);
}

Change "rollover" to the word or phrase that will be the target of the rollover (leave in quotes)
Change the url to the actual URL of the image
(Optional) Change or remove the color and text-decoration lines

Casey Maynard

Where is the Rollover Macro?

Eliot Cole

Hi, @Milo Test, just wondering, I'm trying this in the latest confluence, and it's not possible to place the span macro in the rollover macro's body.

I'm well aware how to edit the markup, or even the html to do this, but I need to leave a legacy to the people that come after me that might not be conversant in these methods but can still follow the logical path of the visual elements in the WYSIWYG editor of the modern Confluence Server.

Is there a simple way around this? I'm desperate to replace me CSS rollovers with something Confluence native.

Sorry to bother you on a 3 year old issue.

Milo Grika

Sadly, I can't seem to get the trigger to be inline either — something seems to have changed since then (https://jira.atlassian.com/browse/CONFCLOUD-53073).

Thankfully, I don't think I ever actually used the rollover macro anywhere; just as an experiment to answer the question.