Ask questions and get good answers on mb.jQuery.components

Hi, I'm implementing this component on my site but I found out that in IE7 all the elements are diplayed one under the other. How can I solve this bug?

asked Oct 30 '09 at 19:06

CTuri's gravatar image

CTuri
112

closed Feb 11 '11 at 15:52

Matteo%20Bicocchi's gravatar image

Matteo Bicocchi ♦♦
1776129

The question has been closed for the following reason "The question is answered, right answer was accepted" by Matteo Bicocchi Feb 11 '11 at 15:52


The jquery.mb.scrollable component use the css attribute "display:inline-block" for each element; IE7 doesn't support this (This is really incredible!!).

To solve this bug you have to change line 59:

from

 $(this.elements).css({marginRight:this.options.elementMargin, width:this.singleElDim, display:"inline-block"});

to

 $(this.elements).css({marginRight:this.options.elementMargin, width:this.singleElDim, display:"inline-block",float:"left"});

This bug will be fixed on version 1.0.1

answered Oct 30 '09 at 19:10

Matteo%20Bicocchi's gravatar image

Matteo Bicocchi ♦♦
1776129

Hi I had to add this on line 59 also in the vertical declaration display:"inline-block",float:"left" I had all the inside block of the scroller going to the right and not displaying correctly. Now solved thanks for the plugin

answered Apr 01 '10 at 08:35

michel's gravatar image

michel
111

This solution only fixes the elements for the images, but the controls does this as well in IE only. How to fix the controls part? As you can see here >> http://goldlilys.110mb.com/Goldlilys/

Edit: Nevermind, also had to change the css for the controls to include the float:left

answered Nov 17 '09 at 05:38

goldlilys's gravatar image

goldlilys
11

edited Nov 17 '09 at 06:26

1

Yes, but the controls are all defined in the CSS file and their display is controlled independently of the component. You should change the CSS adding "float:left" to all the controls CSS classes:

controls div, #controls1 div{

font-family:sans-serif; margin-top:5px; background:#fff; display:inline-block; *float:left; padding:6px; cursor:pointer; -moz-border-radius: 4px; -webkit-border-radius: 4px; -moz-box-shadow:#999 2px 2px 2px; -webkit-box-shadow:#999 2px 2px 2px; }

(Nov 17 '09 at 09:14) Matteo Bicocchi ♦♦

Having the same issues on my vbulletin 4 styles website, i would really love to use this as i think it is awesome work :)

answered Feb 28 '10 at 04:25

lisa's gravatar image

lisa
1

Controls with addition of float:left; in the CSS is still blown apart in IE7. link text Looks good elsewhere...

answered Jan 25 '11 at 22:29

beyoyo2's gravatar image

beyoyo2
1

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Tags:

×10
×7

Asked: Oct 30 '09 at 19:06

Seen: 1,791 times

Last updated: Feb 11 '11 at 15:52

jQuery main site - Matteo Bicocchi