Boxy (A Grid-Like Hover Table - Banner Alternative)

[Alanna 🥀🖤]

Sept 1, 2014 7:47:02 GMT -8 Fox. said:

I didn't make any changes to your code though (yet). I just went and copy pasted.

Make sure you pasted the CSS in your Style Sheet and not the Forum Wrapper where you pasted the HTML. Go to Admin > Themes > Advanced Styles & CSS and click the Style Sheet tab. Then past the CSS Risa has provided at the bottom of that text area.

[Fox.]

It is at the bottom of the style sheet.

[Risa]

Fox. if everything is in place, this might be something you should have the Proboards Admins take a look at inside your forum and see why the css isn't being recognized by the class calls in the templates. Maybe David Clark or Brian could help us out here?

[Brian]

Fox., you appear to have placed the CSS before the closing brace for this section.

/* Screen-only (tablets, phones) */
@media only handheld {
    textarea { font-size: 2em; }
}

You'll need to close it off again and remove the extra closing brace at the end of the style sheet to fix it.

[Risa]

Thanks so much, Brian! 8)

[Fox.]

Thanks! Looks good now.

[bellebella]

Using here.

Question: When my internet window is minimized the banner/hovers are cut off.  I also noticed on my I-Pad this is the same way.  Is there a way to have the banner/hovers stay in place no matter if my internet window is max or minimized?

[Risa]

well, for the forum you're showing me right now, your wrapper is too small. that was an edit used with the wrapper at 100%. As for the mobile version or minimized version, you could always go through and set them to percentages. I don't have an IPAD or I'd recode and check for you.

[Sarah]

Using on my test forum to make sure I do it right before I do it for my main one.

Test forum: here.

There was a gap at the right, and so I tried what you said to the other user who had the same problem as me to do, and it still kinda looks a bit off to me. Or does it look fine to you? 

If I decide not to use the additional box, why is there a gap? I pretty much copied and pasted what you had here onto there...so...not sure where I messed up.

[Risa]

looks fine to me, Sarah i.imgur.com/54PO4t0.png I'm on 1360 x 768 monitor resolution. i.imgur.com/rGFOFV4.png this is what I see with a higher resolution. If that's what you're looking at, add some more boxes. You might want to check around with your members to see what the average monitor resolution is for them. If it's mine or lower, they won't be able to see the content that you add to those last boxes like I showed you in the first image. You can increase the forum wrapper to 100% if you need that many boxes. All in all, fiddle around with your boxes width and forum wrapper percentage until you find a happy medium. If you need more help, I'll do what I can. 8)

[Yorko]

This is fantastic

Thank you so much, I love it

[dezhoni]

Risa

Hello,

 I absolutely love the code. I honestly don't know whether or not this can happen, but is there anyway I can make the banner images transparent or not visible when the banner isn't being hovered over? I was wanting the banner image to be totally visible, but once it is hovered over those boxes pop up with the site information and whatnot. Thank you so very much! I hope I could be understood.

Also! Site link is - genesis-revived.boards.net

-Dezhoni'

[Risa]

Hi dezhoni

Based on the info you gave me, it sounds like you might want to try Trinity's hover tutorial. support.proboards.com/thread/539402/basic-hover-banner-tutorial  Mine is more compartmentalized in individual tables whereas Trinity's uses just the one banner like I think you want. If I'm wrong, feel free to correct me. If there's something you're not sure of, send me a pm. Or, maybe I can help you alter mine to do what you want as well.

[[ RENZ ]]

Risa I LOVE how you do the visual aids. AWESOME idea! Wish more people did that! So just wanted to say thank you for that - and the banner code, which I'm currently working on tweeking for my new theme.

[Risa]

[ RENZ ] Thanks! I'm glad that the visual aids help. Whatever helps people, ya know? Good luck on the tweeking! It'll be spectacular. 8)