First time posting here so do forgive me if i have any markup issues. Im not used to the SOF framework for writing posts.Im trying to make some social icons bounce on my site on hover. I grabbed the code over from jQuery UI to test it out and made some small edits however im running into a problem with double images being visible on the page. When the mouse hovers over the image it bounces but a duplicate is visible from behind the bouncing image. If i move the mouse away during the bouncing session and quickly hover back over the icon it bounces correctly hiding the image behind.So how can i force it to consistently hide the image behind?\[code\]<!DOCTYPE html><html><head><link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script><script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script><style type="text/css">div { width: 32px; height: 32px; background-repeat:no-repeat; background-image: url(http://www.liquidclubs.com/assets/img/icon-fb.png); border: position: relative; }</style><script>$(document).ready(function() {$("div").mouseenter(function () { $(this).effect("bounce", { times:3 }, 350);});});</script></head><br><br><div></div></body></html>\[/code\]
jQuery UI Bounce (double image)
- Thread starter GreySoul
- Start date