Ask your WordPress questions! Pay money and get answers fast! (more info)

Direction Aware Hover Effect WordPress

  • REFUNDED

Hi There,

I previously posted this question and didn't get a solution:

Hi There,

I am looking for someone to help me acheive the mouse in hover over effect, demonstrated here:
http://tympanus.net/codrops/2012/04/09/direction-aware-hover-effect-with-css3-and-jquery/

I am using the plugin: http://codecanyon.net/item/media-grid-wordpress-responsive-portfolio/2218545

This is for the services on the site.
Project url 213.229.123.230/~yepyehco/sites/visualresponse/

Many Thanks

Answers (2)

2013-03-08

Abdelhadi Touil answers:

Hi.
If you can send me the theme, then I'll try to make changes you want by adding the hover effect. You can send it to me by email.
Good luck.

2013-03-08

John Cotton answers:

From the hover demo, the code looks simple enough:


<script type="text/javascript">
$(function() {

$(' #da-thumbs > li ').each( function() { $(this).hoverdir(); } );

});
</script>


You need to put this code on the page and change ' #da-thumbs > li ' to a selector that works for your services elements (if you gave the container div and id or class, that would make your life much easier).

Then, remove the current hover cover (which appears to be these lines in ownScript.js - but the code isn't documented so it's hard to be sure)

/* wp gallery hover */

jQuery('.imgwrap').hover(function() {
jQuery(this).find('a.hoverstuff-link,a.hoverstuff-zoom')
.animate({
opacity: '1',
}, 100);

} , function() {

jQuery(this).find('a.hoverstuff-link,a.hoverstuff-zoom')
.animate({
opacity: '0',
}, 400);
});


Finally, include the source hover js, it should just work.


yepyeh comments:

Hi John! Would you mind assisting me implementing this solution?

Many Thanks


John Cotton comments:

Er...isn't that what I've just done?


yepyeh comments:

Ok, well I mean doing it for me!


John Cotton comments:

Try and follow my instructions. If they don't make sense, ask. If you still can't do it, you should get a developer in to help. Sorry, I don't have time today for that.


John Cotton comments:

Try and follow my instructions. If they don't make sense, ask. If you still can't do it, you should get a developer in to help. Sorry, I don't have time today for that.


John Cotton comments:

<blockquote>Ok, well I mean doing it for me!</blockquote>
PM me if you want to hire me.


yepyeh comments:

Ok dude, Thank you. I will try and do it myself.
Thank you. I'll vote you if it works for me!