Reputation: 397
I'm attempting to dynamically load in a shopping cart on page load, which works great in everything other than Internet explorer (tested in version 8 and version 11). The code is:
<script type="text/javascript">
$(document).ready(function($){
$(".view_cart, .cart_close_button").click(function () {
$("#cart_content").toggle();
$(".view_cart").toggleClass('toggled');
$(".cart_button").toggleClass('cart_pressed');
$(".cart_header").toggleClass('show');
$(".cart_close_button").toggleClass('show');
$(".cart_total_icon").toggleClass('hide');
return false;
});
$.get("/products/show_cart", function(cart){ // Get the contents of the url cart/show_cart
$("#cart_content").html(cart); // Replace the information in the div #cart_content with the retrieved data
});
});
$(window).load(function(){
setTimeout(function(){ $('.page_message').fadeOut() }, 4000);
});
</script>
HTML for the cart page (this is very basic at the moment)
<div class="content">
<div class="grid grid-pad">
<div class="col-1-1">
<span class="page_message green_alert"><strong>Cart cleared.</strong> Your shopping cart has been emptied.</span>
</div>
</div>
<div class="cart_button">
<a href="#" class="view_cart" title="View your cart"><i class="fa fa-shopping-cart fa-3x"></i> <span class="cart_header">Your Shopping Cart</span></a>
<a href="#" title="Hide your cart" class="cart_close_button">X</a>
<div id="cart_content">
<p>CART STUFF GOES HERE</p>
</div>
</div>
</div>
Anybody know why IE doesn't want to play ball here? It works if I add the .get
code into the click function, but that causes a small delay when opening the cart box, which I want to avoid really.
Edited to add page HTML and IE versions.
Upvotes: 0
Views: 10937
Reputation: 953
After all the comments i think is a jquery version problem. Just check wich version of jquery you need for IE <=8 and IE >=9. You can use this code:
<!--[if lt IE 9]>
<script src="jquery-1.9.0.js"></script>
<![endif]-->
<!--[if (gte IE 9) | (!IE)]><!-->
<script src="jquery-2.0.0.js"></script>
<!--<![endif]-->
You can check this jsFiddle with diferents versions of IE: http://jsfiddle.net/6GVBz/19/show/
Check this link http://www.impressivewebs.com/loading-different-jquery-version-ie6-8/
Upvotes: 4