MyBB Community Forums

Full Version: "Hover" spoilers
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
I'm trying to find a MyCode that will allow me to create spoilers that will reveal themselves upon hovering over the black, similar to what Reddit and 4chan use for spoilers while using the trigger "\[spoiler\](.*?)\[/spoiler\]" to preserve the existing spoiler alerts on the site

Help please?
Try this.

Regular Expression
\[spoiler\](.*?)\[/spoiler\]

Replacement
<span style='color:#000000; background:#000000' onmouseover="style.color='#ffffff'" onmouseout="style.color='#000000'"><b>$1</b></span>
As far as I can tell so far, this is working perfectly

Thanks

The only complaint I have is that the spoiler text looks like it's bolded but perhaps that's just an optical illusion?
Its bolded because of <b> and </b> in the code.
Crap, I should've tried that before I opened my mouth; I tried deleting the entire <b>$1</b> segment instead so it showed absolutely nothing in place

How embarassing...
If you want to remove boldness from font, then just remove <b> and </b> tags.
Yeah I did, as soon as I read this:

(2012-05-29, 06:13 AM)Yaldaram Wrote: [ -> ]Its bolded because of <b> and </b> in the code.

Thanks
<span style='color:#000000; background:#000000' onmouseover="style.color='#ffffff'" onmouseout="style.color='#000000'">$1</span>
(2012-05-29, 05:14 AM)Irreligious Wrote: [ -> ]Try this.

Regular Expression
\[spoiler\](.*?)\[/spoiler\]

Replacement
<span style='color:#000000; background:#000000' onmouseover="style.color='#ffffff'" onmouseout="style.color='#000000'"><b>$1</b></span>
Thanks a lot man Big Grin
This is quite the bump, but people should know this:

You don't need to use javascript for this. Just create a "spoiler" class, and set it to show itself when hovered over in your global.css file.

Like this:

.spoiler {
color: #000;
background: #000
}

.spoiler:hover {
color: #fff
}

And your replacement would be

<span class="spoiler">$1</span>

You should avoid using inline CSS and JS wherever possible. Using JS for something as simple as this is ridiculous, and even though this was posted nearly a year ago, it was ridiculous even then. No offense, of course.
Pages: 1 2