jsor / jcarousel

Riding carousels with jQuery.
https://sorgalla.com/jcarousel/
MIT License
1.99k stars 734 forks source link

not working in IE6 #116

Closed CreativeZest closed 13 years ago

CreativeZest commented 13 years ago

Hi all,

I've created my new website to work in the following browsers:

IE 7, 8 and 9 Firefox 3.6.13 Opera 11.00 Safari 5.33.19.4 Google Chrome 8.0.552.237

It works perfectly on all of those, however it does not work in IE6 or 5.5. The CSS is isn't working (which I can fix no problem). Apart from the CSS being slightly out the only element that isn't working as it should is the jcarousel script.

Now I'm not too bothered about getting it to work in IE5.5 since thats such an old version and most of my target market will have upgraded versions of IE. But I would like to enable it to work in IE6.

I have a jwSlider which functions properly in IE6 and also a jQuery image cycler working fine in IE6.

Why can't Microsoft sort this shit out?! It really is very infuriating...you would of thought that with all of the money and resources available to such a large corporation that they would be able to iron out degradable issues. You know, I mean develop the next version of IE to act in the same way as the previous version with regards to reading code. Other browsers don't seem to be too bad at that so what's Microsoft's problem? It's not like that have a financial vested interest in forcing people to upgrade their IE browser since they are free to download. So why???

Ahhh that's better! ;-)

Firstly I've noticed that IE 6 is unable to render the jcarousel-control navigation buttons in the header. It doesn't seem to like the fact that the id's are set as _1, _23, _28, _33. in other words the underscore and the number seem to offend it. If I set the id's as simply words then the buttons show in IE6.

This causes a major problem since the jcarousel code is written in such a way that tells the buttons which element in the carousel to scroll to when pressed. I had designed the site so that I could have external nav (rolloever) buttons controlling the carousel, being able to style them up as I wish (using graphics instead of dynamically loaded numbers)

The only way to achieve as well as retaining the carousels functionality was to edit the code slightly and create id's that linked to the CSS for styling purposes and the introduction of the "_1", "_2" etc numbering system, which links to the jcarousel code. Sine your tutorial doesn't cater for the creation of a carousel using external graphic buttons I had to search the net for a solution. I found one and followed it editing the this code:

CreativeZest commented 13 years ago

Oh...this site seems to have taken out all of the paragraph spaces and some special characters such as underscores...tut, that's not very good.

CreativeZest commented 13 years ago

Basically I'd ameded the html for the external nav buttons to this:

changing the number and title for each one, they link to the relating ID's in CSS which look like this:

.jcarousel-control #_1 { display: block; width: 77px; height: 128px; float:left; margin-top: 1px; margin-left: 0px; background: url("images/identity_btn.png") no-repeat 0 0; border: 0px; }

.jcarousel-control #_1:hover { background-position: 0 -129px; }

Then edited the init callback code to this:

function mycarouselinitCallback(carousel) { jQuery('.jcarousel-control a').bind('click', function() { var index = $(this).attr("id").split(""); carousel.scroll(jQuery.jcarousel.intval(index[1])); //carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text())); $(".jcarousel-control a").removeClass("active"); //Remove any "active" class $(this).addClass("active"); return false; });

Hope this displays properly this time.

Marc

jsor commented 13 years ago

So, whats the question now? If IE6 doesn't accept id's with the _ prefixed, theres nothing jCarousel can do...