i need to display the different versions of a product that i am selling using imagerollover script..

hi...
i need to display the different versions of a prduct that i am selling using image rollover sript...
pls go through the link (  http://turbotax.intuit.com/?cid=int_int_bus_idcpromo_eb   )   .... this is what exactly i want.. i dont have any idea on this script ... any ideas frm the experts?

Thanks in advance ...
layout.png
LVL 2
Rajeshk_cgmAsked:
Who is Participating?
 
Michel PlungjanConnect With a Mentor IT ExpertCommented:
they use jQuery

/*-------------------------- Flippy ----------------------------*/
 
jQuery.fn.setFlippy = function(body_height) {
	var container = jQuery(this);
	container.find("li").addClass("flip");
	container.find("li").not(".active").children(".body").css("height", "0px").css("overflow","hidden").hide();
	container.find("li.active").children(".body").css("height",body_height);
	container.find(".title").hoverIntent({
   sensitivity: 25, 
   interval: 100, 
   over: function() {
		var target = $(this).parent();
		var target_parent = target.parent();
		if (!target.hasClass("active")) {
			if (target_parent.find(".active_old").html() != null) {
				target_parent.find(".active").children(".body").stop();
				target_parent.find(".active_old").children(".body").height(0).hide();
				target_parent.find(".active").children(".body").height(body_height);
				target_parent.find(".active_old").removeClass("active_old");				
			}
			target_parent.find(".active").addClass("active_old").removeClass("active");
			target.addClass("active");	
			target.children(".body").animate({height:body_height}, {
				step: function(now, fx) {
					target_parent.find(".active_old").children(".body").height(body_height - (now));
				},
				duration: 300,
				complete: function() {
					target_parent.find(".active_old").children(".body").hide();
					target_parent.find(".active_old").removeClass("active_old");
				}
			});
		}		
	 }, 
   timeout: 100, 
   out: function() {} 
	});	
}
 
 
/*-------------------------- Slidey ----------------------------*/
 
jQuery.fn.slideTo = function(target_id, settings) {
	settings = jQuery.extend({
     easeTime: 400
  }, settings);
	var container = jQuery(this);
	$.each( container.find(".section"), function(i, n){
		$(n).attr("rel",i);
	});
	var width = container.width();
	var z = $(target_id).attr("rel");
	var cnt = - (width*z);
	if (isNaN(cnt)) cnt = 0;
 
	container.find(".itab_content").animate({left:cnt}, {
		duration: 600,
		easing: "easeInOutQuint",
		complete: function() {
			var left = $(this).css("left");
			var distance = left.split("px");
			if (distance[0] > -500) $(this).css("left",0);
		}
	});		
}

Open in new window

0
 
jaydee-cdgpCommented:
Dynamic Drive has a collection of mouse over / Image Effects scripts with Demo.  Have a look at: http://www.dynamicdrive.com/dynamicindex4/index.html

make sure to check links under SUB CATEGORIES
0
 
Rajeshk_cgmAuthor Commented:
hi ..
thank u for ur reply.. i have gone through on all  the  collections  under all  subcategories...

but it doesn't suite my requirement...pls let me know if u have any more  reference sites....

waitning for  ur reply ...
0
Cloud Class® Course: SQL Server Core 2016

This course will introduce you to SQL Server Core 2016, as well as teach you about SSMS, data tools, installation, server configuration, using Management Studio, and writing and executing queries.

 
Rajeshk_cgmAuthor Commented:
hi...
Thank u
 u have any sample project for this.... ?
0
 
Michel PlungjanIT ExpertCommented:
You posted a great example :)
0
 
Michel PlungjanIT ExpertCommented:
Sorry, a "C" is not acceptable - especially not without commenting why.
Also this is not Rent-a-coder-for-free
I gave you the part of the script that does what you need.
if you need to get someone to implement this, I am afraid I do not have the time.

Please request this question deleted instead of giving a "C" for not producing all the code you need
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.