HTML-изображение вертикальное выравнивание

Question

Я использую HTML, CSS и JQuery, и я сделал эффект наведения изображения с изображением часов, и я хочу иметь возможность добавлять одно и то же изображение и эффект с несколькими изображениями вертикально вниз по центру страницы но это не позволит мне, вот сайт, о котором идет речь! любая помощь была бы замечательной!

<div id="header"> 
    <h1></h1> 
</div> 
<div class="center12"> 
    <img src="image/logocenter1.png" alt="** PLEASE DESCRIBE THIS IMAGE **"> 
</div> 
<div id="nav"> 
    <h2> 
     <a href="index.html" class="rollover">Home</a>/<a href="style.html" class="rollover">Styles & Sizes</a>/
     <a href="brand.html" class="rollover">Brands & Prices</a>/
     <a href="strap.html" class="rollover">Watch Straps</a>/<a href="used.html" class="rollover">Tips on buying used</a> 
    </h2> 
</div> 
<div class="fadehover"> 
    <img src="image/test1.png" alt="" class="a"> <img src="image/test1bw.png" alt="" class="b"> 
</div> 

Кажется, он должен быть простым, но он не будет работать.

Answer 1

Instead of using jquery and two images for gray scale effect, use the following: 

By adding an css you can bring the same effect using a single image(no need of jquery and hover image). 

Add this css: 

<pre> 
img.a:hover { 
    filter: url(""); 
    } 
</pre> 

and remove the jquery and another gray scale image. If you don't want hover effect and the images are needs to be shown one by one down, remove one of the images inside the div and put it into a separate Div'