logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > Javascript and JS frameworks
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 02-16-2012, 04:21 PM   #1
cocoonfx
cocoonfx's Avatar
 
Join Date: Nov 2006
Location: Tamworth,UK
Posts: 576
Default Jquery Flip Image - Can't work it out

Hi Guys

I am using something similar to the below URL. I however want to change some of the functionality and not so good with JQuery I can not work out how to do what I want.

http://www.test-cocoonfxmedia.co.uk/demo/demo.php

So what I want to happen is on the mouse over I want the image to flip. Then stay flipped then when you click it will take you through to a URL. when you mouse out it flips back. Any suggestions?

Code:
$(document).ready(function(){
	/* The following code is executed once the DOM is loaded */
	
	$('.sponsorFlip').bind("click",function(){
		
		// $(this) point to the clicked .sponsorFlip element (caching it in elem for speed):
		
		var elem = $(this);
		
		// data('flipped') is a flag we set when we flip the element:
		
		if(elem.data('flipped'))
		{
			// If the element has already been flipped, use the revertFlip method
			// defined by the plug-in to revert to the default state automatically:
			
			elem.revertFlip();
			
			// Unsetting the flag:
			elem.data('flipped',false)
		}
		else
		{
			// Using the flip method defined by the plugin:
			
			elem.flip({
				direction:'lr',
				speed: 350,
				onBefore: function(){
					// Insert the contents of the .sponsorData div (hidden from view with display:none)
					// into the clicked .sponsorFlip div before the flipping animation starts:
					
					elem.html(elem.siblings('.sponsorData').html());
				}
			});
			
			// Setting the flag:
			elem.data('flipped',true);
		}
	});
	
});
cocoonfx is offline   Reply With Quote
Old 02-17-2012, 09:45 PM   #2
ranjan
 
Join Date: Dec 2004
Posts: 405
Default Check out the demos

http://www.zachstronaut.com/projects/rotate3di/
ranjan is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 05:08 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com