Go Back   CodingForums.com > :: Client side development > JavaScript programming > JavaScript frameworks

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 11-02-2011, 10:58 AM   PM User | #1
MARKMAKAVELI
New to the CF scene

 
Join Date: Oct 2011
Posts: 7
Thanks: 5
Thanked 0 Times in 0 Posts
MARKMAKAVELI is an unknown quantity at this point
Make this compatible with ie6?

Hi All,

I can't get the images on this carousel to display in ie6 although it does work fine in chrome. The end users will be on ie6 with no updates really, so need to make it work on the bare minimum setup. Please can someone help?

Code:
(function($) { //create closure
	$.fn.jq3dcarousel = function (defaults) {
		moveCarousel = function (){
			var count = defaults.count;
			var rX = defaults.rX;
			var rY = defaults.rY;
			var cX = defaults.cX;
			var cY = defaults.cY;
			var direction = defaults.direction < 0 ? -1 : 1; 
			var imgWidth = defaults.imgWidth;
			var zIndexFactor = defaults.zIndexFactor;
			var angle = 0, left = 0, top = 0, zIndex = 0, width = 0;
			var genSpeed = defaults.speed;
			var genAngle	= Math.PI * 2 / defaults.nrEle;
			var maxHeight = defaults.carousel;
			var objectCounter = 0;
			jQuery.each(defaults.imageDivs, function()
			{
				angle = objectCounter * genAngle + count * genSpeed;
left =  cX + direction * rX * Math.sin( angle );
				top =  cY + rY * Math.cos( angle );
				zIndex = Math.round(top) * zIndexFactor;
				width = imgWidth * ( 3 +  ( top - cY ) / rY ) / 4; // width from 100% to 50%
				top -= width * .5;
				left -= width * .5;
				jQuery(this).css('top', top + 'px')
					.css('left', left + 'px')
					.css('width', width + 'px')
					.css('zIndex', zIndex);
				objectCounter++;
			});
			defaults.count++;
			if(defaults.count>1000000000000) defaults.count = 0;
		}
		hoverIn = function(ele) {
			var re = new RegExp( '^(.*)\.jpg$', 'g' );
			var tmpSrc = jQuery('a img',ele)[0].src.replace(re, '$1_hover.jpg');
			jQuery('a img',ele)[0].src = tmpSrc;
		}
		hoverOut = function(ele) {
			var re = new RegExp( '^(.*)_hover\.jpg$', 'g' );
			var tmpSrc = jQuery('a img',ele)[0].src.replace(re, '$1.jpg');
			jQuery('a img',ele)[0].src = tmpSrc;
		}
		replaceImg = function(ele, strMatch, strReplace) {
			var re = new RegExp( strMatch, 'g' );
			var tmpSrc = jQuery('a img',ele)[0].src.replace(re, strReplace);
			jQuery('a img',ele)[0].src = tmpSrc;
		}
		
		jQuery(document).ready(function() {
			defaults.carousel = jQuery('.jq3d_carousel', this);
			defaults.imageDivs = jQuery('.jq3d_carousel div', this);
			defaults.nrEle = defaults.imageDivs.length;

			if(defaults.buttonPP === 1) {

				clearInterval(defaults.carousel_timer);
				defaults.carousel_timer = setInterval('moveCarousel()',defaults.interval); // runOnLoad
			} else {
				moveCarousel(); // set first Position
			}
			defaults.imageDivs.show();
			defaults.imageDivs.bind('mouseenter', function(evt) {
					hoverIn(this);
					var pHeader = '<p>' + jQuery('input',this)[0].value; + '</p>';
					var pText = '<p>' + jQuery('input',this)[1].value; + '</p>';
					jQuery('.jq3d_display', this.parent).append(pHeader).append(pText).show();
					if(defaults.buttonPP === 1) {
						clearInterval(defaults.carousel_timer);
					}
				})
				.bind('mouseout', function(evt) {
					hoverOut(this);
					jQuery('.jq3d_display', this.parent).hide().empty();
					if(defaults.buttonPP === 1) {
						clearInterval(defaults.carousel_timer);
						defaults.carousel_timer = setInterval('moveCarousel()',defaults.interval);
					}
				});
			
			jQuery('.jq3d_buttonPP', this).bind('click', function(evt) {
					if(defaults.buttonPP === 0) {
						clearInterval(defaults.carousel_timer);
						defaults.buttonPP = 0;

					} else {
						clearInterval(defaults.carousel_timer);
						defaults.carousel_timer = setInterval('moveCarousel()',defaults.interval);
						defaults.buttonPP = 0;

					}
				})
				.bind('mouseenter', function(evt) { hoverIn(this); })
				.bind('mouseout', function(evt) { hoverOut(this); });
			jQuery('.jq3d_buttonCD', this).bind('click', function(evt) {
					if(defaults.direction < 0) {
						defaults.direction = 1;
						replaceImg( this, '^(.*)clock_hover\.png$' , '$1counterclock_hover.png' );
					} else {
						defaults.direction = -1;
						replaceImg( this, '^(.*)counterclock_hover\.png$' , '$1clock_hover.png' );
					}
				})
				.bind('mouseenter', function(evt) { hoverIn(this); })
				.bind('mouseout', function(evt) { hoverOut(this); });
		}); // end ready fct
	} // end jQ3dcarousel fct
})(jQuery) // end closure

jQuery('#jq3d_carousel_frame').jq3dcarousel({ // call the carousel
	count:				0, // continuing counter for sin/cos
	speed:				0.005, // defaultSpeed
	rX:					180, // ellipse radius x-axis
	rY:					60, // ellipse radius y-axis
	cX:					245, // ellipse center x-axis
	cY:					100, // ellipse center y-axis
	direction:			-1, // negative == clockwise, positive counter-clockwise
	imgWidth:			160, // constant factor for image width (size)
	zIndexFactor:	10, // multiplying factor for z-axis (multiplied by position top)
	imageDivs:		'', // placeholder for the divs in the carousel
	nrEle:				0, // number of elements
	carousel:			'', // the carousel div
	interval:				20, // time in ms for setInterval()
	carousel_timer:	'', // placeholder for the timer
	buttonPP:			1 // Play/Pause-Button 
});
MARKMAKAVELI is offline   Reply With Quote
Old 11-02-2011, 09:37 PM   PM User | #2
footballer27
New Coder

 
Join Date: Oct 2011
Posts: 85
Thanks: 13
Thanked 1 Time in 1 Post
footballer27 is an unknown quantity at this point
Just from curiosity, how do you know they are running ie6. W3schools says that only 1.8% of users use ie6 anymore.
footballer27 is offline   Reply With Quote
Users who have thanked footballer27 for this post:
MARKMAKAVELI (11-03-2011)
Old 11-03-2011, 10:45 AM   PM User | #3
MARKMAKAVELI
New to the CF scene

 
Join Date: Oct 2011
Posts: 7
Thanks: 5
Thanked 0 Times in 0 Posts
MARKMAKAVELI is an unknown quantity at this point
I'll be finding out for sure today but our suspicion is that they have had their pc's for many years an they only really use them for running one program so no updates are ever installed.

Good stat though, appreciate that. We just want to make sure the website we create can run on the most out of date, no plugins installed etc. Backwards I know but that's what we're dealing with!
MARKMAKAVELI is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

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 +1. The time now is 05:44 PM.


Advertisement
Log in to turn off these ads.