CODEWITHSUNDEEP
javascriptjqueryinternet-explorer-7
Thomas Shelby
Thomas Shelby

Reputation: 1370

jQuery UI Button doesn't work on IE 7

I have this code:

<script type="text/javascript" src="<?=$path?>common/_LIB/3rd/jquery/jquery-ui-1.8.16/js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="<?=$path?>common/_LIB/3rd/jquery/jquery-ui-1.8.16/js/jquery-ui-1.8.16.custom.min.js"></script>
<link type="text/css" href="<?=$path?>common/_LIB/3rd/jquery/jquery-ui-1.8.16/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet" />

<script>
    $(function() {
            $('.button,.button floatRight').button();
    });
</script>

and

<a class="button floatRight" href="handset_list.php"><?=$reprint?></a>

and all is well on Chrome and FF, IE 9, but on IE 8 and IE 7, I can't see the button for the above link only.

Upvotes: 0

Views: 367

Answers (3)

11684
11684

Reputation: 7507

You probably mean

$(function() {
        $('.button,.button floatRight').button();
});

A space in the tag attribute means there are two classes. In your case the button you try to target has two classes: button and floatRight. Hence two dots.

EDIT:
I found something else: the function $("#something").button(); calls $.data a lot of times. According to caniuse.com IE only has partial support for custom data on attributes, So, it may not work as the jQuery UI developers think it would in IE 7. The many calls to $.data make me think the .button() function kind of relies on it (but I don't really understand it yet, I just had a quick glance). If that is so, that is probably the cause. If you really need IE 7 support I suggest using a jQuery UI build released when IE 7 was the most used IE, although that might not support all features you use now. I'd say just let IE 7 users see an anchor. What's so bad about an anchor?

Upvotes: 0

Wasim
Wasim

Reputation: 1174

Try the following code:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

Upvotes: 1

Dziad Borowy
Dziad Borowy

Reputation: 12579

You have an error in your code in jQuery selector. There is no tag name called "floatRight". Try this:

$('.button').button();

Upvotes: 2

Related Questions