Solved: blockcart mouseover affects blockuserinfo border-radius

[jleesaxon]

blockuserinfo.css contains the following code:

 

#shopping_cart a {
...
border-radius:3px;
...
}

 

As long as I don't change that, everything works perfectly. But what if I want a different value, say 10px?

 

If blockcart is uninstalled/disabled, this change works perfectly (telling us that blockcart, not blockuserinfo, is likely the cause/location of the problem).

 

But nobody is going to use one of these modules without the other, so let's look at what happens with blockcart installed.

 

I write this code in blockuserinfo.css:

 

#shopping_cart a {
...
border-radius:10px;
...
}

 

At first, it displays correctly. But when I mouse over the link, the radii change to:

 

#shopping_cart a {
...
border-radius:3px 3px 0px 0px;
...
}

 

And when I mouse back off the link, the radii change again to:

 

#shopping_cart a {
...
border-radius:3px;
...
}

 

I can't find anything in blockuserinfo.css or blockcart.css that would explain it.

Edited July 21, 2013 by jleesaxon (see edit history)

[vekia]

it's related to the js file: /modules/blockcart/ajax-cart.js

 

search for:

$("#shopping_cart a:first").hover(
 function() {
  $(this).css('border-radius', '3px 3px 0px 0px');
  if (ajaxCart.nb_total_products > 0)
   $("#cart_block").stop(true, true).slideDown(450);
 },
 function() {
  $('#header #shopping_cart a').css('border-radius', '3px');
  setTimeout(function() {
   if (!shopping_cart.isHoveringOver() && !cart_block.isHoveringOver())
 $("#header #cart_block").stop(true, true).slideUp(450);
  }, 200);
 }
);

 

and comment the:

// $(this).css('border-radius', '3px 3px 0px 0px');

+

// $('#header #shopping_cart a').css('border-radius', '3px');

[jleesaxon]

Wonderful! Thank you! This also led me to the solution to http://www.prestashop.com/forums/topic/260949-configuring-blockcart-location/page__p__1300475?do=findComment&comment=1300475

Edited July 21, 2013 by jleesaxon (see edit history)

[vekia]

you're welcome

 

thanks for information about other thread too

 

happy selling

 

regards

[jleesaxon]

One additional note for anyone else messing with border radii:

 

My original question and vekia's answer pertained to the border-radius glitch that ajax-cart.js causes when blockuserinfo's "#shopping_cart a" (the collapsed cart summary) is moused over. However, I discovered that ajax-cart.js also causes the same glitch when blockcart's "#cart_block" (the expanded cart summary) is moused over! To completely solve the problem, vekia's two lines as well as two more must be commented out. Here they are:

 

$("#shopping_cart a:first").hover(
    function() {
//   $(this).css('border-radius', '3px 3px 0px 0px');
    if (ajaxCart.nb_total_products > 0)
         $("#cart_block").stop(true, true).slideDown(450);
    },
    function() {
//   $('header #shopping_cart a').css('border-radius', '3px');
    setTimeout(function() {
         if (!shopping_cart.isHoveringOver() && !cart_block.isHoveringOver())
              $("header #cart_block").stop(true, true).slideUp(450);
         }, 200);
    }
);

$("#cart_block").hover(
    function() {
//   $('#shopping_cart a').css('border-radius', '3px 3px 0px 0px');
    },
    function() {
//   $('#shopping_cart a').css('border-radius', '3px');
    setTimeout(function() {
         if (!shopping_cart.isHoveringOver())
              $("header #cart_block").stop(true, true).slideUp(450);
         }, 200);
    }
);

Edited July 21, 2013 by jleesaxon (see edit history)