where is the ajax_block_product class in prestashop 1.6?

[kavindaps]

Hi there,

 

I'm trying to style product blocks in home page and I'm using prestashop 1.6. But there are some css values add dynamically into the list items. Height of those list items change on mouse hover.

Still I can't figure out where those values coming from.

 

any help?

[LuckyModule]

Hi there,

 

I'm trying to style product blocks in home page and I'm using prestashop 1.6. But there are some css values add dynamically into the list items. Height of those list items change on mouse hover.

Still I can't figure out where those values coming from.

 

any help?

 

Hello,

 

Need to change the styles in this file

\themes\default-bootstrap\css\product_list.css

 

 

for example height name product

ul.product_list.grid li.hovered h5 {
  min-height: 30px; }

[vekia]

you use default-bootstrap theme?

[kavindaps]

you use default-bootstrap theme?

Yes I'm using default-bootstrap theme.

Edited January 10, 2015 by kavindaps (see edit history)

[vekia]

height of these elemnts is generated in global.js file

 

/themes/your-theme/js/global.js

 

there is a function:

function blockHover(status)
{
	var screenLg = $('body').find('.container').width() == 1170;

	if (screenLg)
		$('.product_list .button-container').hide();
	else
		$('.product_list .button-container').show();

	$(document).off('mouseenter').on('mouseenter', '.product_list.grid li.ajax_block_product .product-container', function(e){
		if (screenLg)
		{
			var pcHeight = $(this).parent().outerHeight();
			var pcPHeight = $(this).parent().find('.button-container').outerHeight() + $(this).parent().find('.comments_note').outerHeight() + $(this).parent().find('.functional-buttons').outerHeight();
			$(this).parent().addClass('hovered').css({'height':pcHeight + pcPHeight, 'margin-bottom':pcPHeight * (-1)});
			$(this).find('.button-container').show();
		}
	});

	$(document).off('mouseleave').on('mouseleave', '.product_list.grid li.ajax_block_product .product-container', function(e){
		if (screenLg)
		{
			$(this).parent().removeClass('hovered').css({'height':'auto', 'margin-bottom':'0'});
			$(this).find('.button-container').hide();
		}
	});
}

[kavindaps]

 

height of these elemnts is generated in global.js file

 

/themes/your-theme/js/global.js

 

there is a function:

function blockHover(status)
{
	var screenLg = $('body').find('.container').width() == 1170;

	if (screenLg)
		$('.product_list .button-container').hide();
	else
		$('.product_list .button-container').show();

	$(document).off('mouseenter').on('mouseenter', '.product_list.grid li.ajax_block_product .product-container', function(e){
		if (screenLg)
		{
			var pcHeight = $(this).parent().outerHeight();
			var pcPHeight = $(this).parent().find('.button-container').outerHeight() + $(this).parent().find('.comments_note').outerHeight() + $(this).parent().find('.functional-buttons').outerHeight();
			$(this).parent().addClass('hovered').css({'height':pcHeight + pcPHeight, 'margin-bottom':pcPHeight * (-1)});
			$(this).find('.button-container').show();
		}
	});

	$(document).off('mouseleave').on('mouseleave', '.product_list.grid li.ajax_block_product .product-container', function(e){
		if (screenLg)
		{
			$(this).parent().removeClass('hovered').css({'height':'auto', 'margin-bottom':'0'});
			$(this).find('.button-container').hide();
		}
	});
}

thanks mate.

that helps

[Catia55]

Hi everybody,

 

At first, sorry in advance if my english is not good.

 

I try to make modifications on my default theme.

I want that : when a product is out of stock, the mention "Out of stock" don't appear on the ajax_block_product in the category page and on the main page (text and block), but appear on the product page (text and block).

I want to make this modification, because I want to change the text on the product page. I want to write available on preorder.

I hope you will understand what I'm looking for.

Think in advance.

 

Catia

[DARKF3D3]

Hello, I have a question about the AJAX effect on over.

I don't use it, so in this case I can remove from the li element of the product list the class "ajax_block_product", or it's used for something else and I risk of broke something else? Or do you think the better way would be to delete the blockHover(status) function from the global.js file?