Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    5
    Thanked 0 Times in 0 Posts

    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 
    });

  • #2
    New Coder
    Join Date
    Oct 2011
    Posts
    85
    Thanks
    13
    Thanked 1 Time in 1 Post
    Just from curiosity, how do you know they are running ie6. W3schools says that only 1.8% of users use ie6 anymore.

  • Users who have thanked footballer27 for this post:

    MARKMAKAVELI (11-03-2011)

  • #3
    New to the CF scene
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    5
    Thanked 0 Times in 0 Posts
    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!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •