Take 50% off our developer subscriptions with the coupon "nifty50" Custom Web Development Services

Support Forum

  • Page:
  • 1

Modifyng Zentools effect in article preview

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Hi!
In the home of my Buildr site, there are 4 articles preview (made with Zentools2).
When the mouse passes over them, the item title is raised. When it does not pass, the title is invisible.
I wish the title was always visible, and when the mouse goes over, the title gets even higher, leaving the first line of the article out.
The home is here:
www.odgraphic.com/03cedim/index.php
Please, see attached image...

zentools2.jpg


Thanks!
  • mikyilfilosofo's Avatar
  • mikyilfilosofo
  • 6 Month Developer
  • 388 posts
  • Karma: 0
The administrator has disabled public write access.
Hi There

In the module settings

"Module layout and settings"

Change animated overlay to overlay

This makes the overlay fixed
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.
It is possible to animate the fixed overlay using some custom css when the mouse hovers over the item

Is this what you are looking to do?

Cheers
Paul
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.
Hi!
yes, please, if you can help me how to animate the fixed overlay via custom css when the mouse hovers over the item, and so displayng the first line of article. The first line of article should only appear when mouse hovers over the item.
Thanks!
  • mikyilfilosofo's Avatar
  • mikyilfilosofo
  • 6 Month Developer
  • 388 posts
  • Karma: 0
The administrator has disabled public write access.
It isn't possible for the first line of text to appear on hover the module doesn't offer this capability at the moment

You could animate the whole container on hover just for that to work it would be best if the text height was one line

The containers being the same height would be best
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.
And then add some css like

#zentools-1001.zt-overlay .zt-item-container:hover {height:120px !important;}

You might want to wrap this in a media query as well and target the module css at different widths

Cheers
Paul
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.
Hi!
I found a little solution with slow transition added to your code, please see the page here:
www.odgraphic.com/03cedim/index.php
But when the mouse hovers near the bottom of 4 articles preview, the titles div "tremble".
In attached image you can see the 4 areas that cause the tremble when the mouse passes over them:
tremble.jpg

How eliminate these areas or the title trembling?
Thanks!
  • mikyilfilosofo's Avatar
  • mikyilfilosofo
  • 6 Month Developer
  • 388 posts
  • Karma: 0
The administrator has disabled public write access.
Hi!
It seems to me that if was possible to use these CSS:

div.zt-item-container.clearfix{
height: 28px !important;
margin-top: -15px !important;
}

...the problem of tremblig was resolved. But "margin-top" doesn't works, and I can only use this:

div.zt-item-container.clearfix{
height: 43px !important;
}

Have you got a solution?
Thanks!
  • mikyilfilosofo's Avatar
  • mikyilfilosofo
  • 6 Month Developer
  • 388 posts
  • Karma: 0
The administrator has disabled public write access.
With using hover I can't see a way round this

Cheers
Paul
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.
Hi!
is it mandatory to use "hover"?
Are there other ways?
Thanks!
  • mikyilfilosofo's Avatar
  • mikyilfilosofo
  • 6 Month Developer
  • 388 posts
  • Karma: 0
The administrator has disabled public write access.
hmm don't think so

At some point you would need the hover css

To be honest you've taken this further than I thought possible

Cheers
Paul
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.
Okay
Thanks for support!
Cheers
  • mikyilfilosofo's Avatar
  • mikyilfilosofo
  • 6 Month Developer
  • 388 posts
  • Karma: 0
The administrator has disabled public write access.
Best of luck with the site

Cheers
Paul
  • paulus103's Avatar
  • paulus103
  • Moderator
  • 44730 posts
  • 2060 Thanks
  • Karma: 600
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers