Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
brndnyn

Hover transition times in Avenue!

Question

Posted (edited)

Site URL: http://www.brndnyn.com

Hello-

 

So I've been trying to change the transition time for my index titles that go over the images. I'm currently using Avenue as my template. 

As it is now, the hover makes the opaque color and text appear a little too quick- I'd like to change that to a slower fade in. However, none of the other code I could find for hover transitions worked for this template. I can't seem to find the tag that effects the title. 

I'm also trying to get my main title and navigation links to ease out when the mouse is no longer hovering, if that's possible.  

Would love any help! 

 

Thanks 🙂

Edited by brndnyn

Share this post


Link to post

4 answers to this question

Recommended Posts

  • 0
Posted (edited)

I think I found something already. 

/*creates opaque rollover effect for regular image blocks*/
.image-block:hover {
background-color: #00000; opacity: 0.6; transition: all .3s ease-in-out;}

Change the .3s to be slower or faster. Larger the number the slower it takes to make the transition. It will need to be modified for index page thumbnails. 

Edited by derricksrandomviews

Share this post


Link to post
  • 0
Quote
53 minutes ago, derricksrandomviews said:

I think I found something already. 

/*creates opaque rollover effect for regular image blocks*/
.image-block:hover {
background-color: #00000; opacity: 0.6; transition: all .3s ease-in-out;}

Change the .3s to be slower or faster. Larger the number the slower it takes to make the transition. It will need to be modified for index page thumbnails. 

Tried this- doesn't seem to work for me. 😞 

I believe I need to isolate what CSS title the project titles are under.

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...