Presta 1.6 backlight image

[pawelh1]

Hello. Can anyone help me how to make backlight image?

 

Example here: http://zensation.polcoder.com/de/

 

here what I mean from zenstation: 

 

Images on the website ( http://www.chemiakosmetyki.pl ) that I want to change:

[thepan]

You want to change those three images? Or change the background image? Or both?

[pawelh1]

 three images, but I want them to be illuminated.

[thepan]

You mean you want them to light up when you move your mouse over them?

[pawelh1]

yep i gave  example http://zensation.polcoder.com/de/ I would like here

[thepan]

To achieve that you need to change some css file.

img:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
}

img {
width: 100%;
margin-bottom: 10px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

I copied this from the site with the example you gave.

You gonna have to edit the selectors to suit your site.

 

Edit: Here more detailed Information.

You need to change the "hook.css" file of your theme. Open that file and replace this part

#htmlcontent_home ul li img {
      max-width: 100%;
      height: auto; }

with this

#htmlcontent_home ul li img {
      max-width: 100%;
      height: auto; 
      margin-bottom: 10px;
      -webkit-transition: all 0.3s ease-in-out;
      -moz-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      -ms-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
      }
       #htmlcontent_home ul li img:hover {
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
      filter: alpha(opacity=70);
      -moz-opacity: 0.7;
      -khtml-opacity: 0.7;
      opacity: 0.7;
      }

Edited October 19, 2014 by thepan (see edit history)

[pawelh1]

thanks bro. But while I still have the open you can write me how to do to reduce the thumbnails in the products and that one line was the case. 6 products. Because on the main page or are 4 products in the category up to 3 consists of a single line.

[thepan]

Sorry but your english is very bad. I just read your post 10 times and I guess you want to change how many products are in each row?

Edited October 19, 2014 by thepan (see edit history)