Tagged: CSS, mobile, Mouse Hover, post titles
-
AuthorPosts
-
January 4, 2016 at 12:31 pm #559139
Hello,
On one of the pages of my site, I have a group of posts displayed where the title gets displayed on mouse hover. The problem with this is that on mobile devices, the “mouse hovers” of course don’t work. What happens then is that the text ends up blocking out the view of the featured image behind it (for reference, compare link #1 on a computer versus on a smart phone). What I would like to have happen instead is for the title to appear in a block below the image when the page is being viewed on a mobile device. If I set the visibility of the title to “Always display element title and excerpt” instead of “Display on mouse hover”, then things look perfect on the mobile screen (for reference, see link #2). So my question is: Is it possible to enable post title visibility on mouse hover when viewing on a computer but then when viewing on a mobile device have the post title get displayed *below* the featured image? I hope this makes sense…! THANK YOU AGAIN!January 5, 2016 at 10:13 am #559796Hi Ashiado!
Hi at the moment it is not possible to do it without making changes to the core files.
However a similar solution is available which might just work great for you and we can to this with help of custom css.We can instead fade out the background color to a dark color and the image will be visible with a black tint.
Here is the code we can try in “Enfold > General Styling > Quick CSS”
@media (max-width: 47.9375rem) { .av-inner-masonry-content.site-background { background-color: rgba(0,0,0, .5); } .av-masonry-entry .av-masonry-entry-title { color: #fff; } .av-masonry-entry .av-masonry-entry-title:hover { color: #fff; } }
Please provide us your login info to help you with this issue further.
Cheers!
VinayJanuary 5, 2016 at 2:47 pm #559942Thanks very much, Vinay! For some reason, the css code above didn’t work, but I was able to modify it so that the post title display could be set to none for the page where it was problematic. Since the hover issue on mobile could be a difficulty for other people too, maybe a workaround could be included in a future release of Enfold? Thanks for the great theme :)
January 6, 2016 at 11:31 am #560415Hey!
You are most welcome & thank you for using enfold :)
I will inform my developers the same and also please feel free to add it in the enfold feature request.
https://kriesi.at/support/topic/enfold-feature-requests/
Best regards,
Vinay -
AuthorPosts
- You must be logged in to reply to this topic.