Есть ли плагин jquery, который вы можете использовать, чтобы затенить изображение и добавить другое изображение частично поверх затененного? - PullRequest
Новая
       10

Есть ли плагин jquery, который вы можете использовать, чтобы затенить изображение и добавить другое изображение частично поверх затененного?

0 голосов
/ 21 октября 2010

Я работаю над страницей, где мне нужен способ, когда пользователь наводит курсор на изображение, оно затеняется и на нем отображается значок шестеренки. Если изображение не может быть серым, можно ли просто наложить значок шестеренки в верхнем правом углу изображения?

1 Ответ

0 голосов
/ 21 октября 2010

Вы не можете использовать эффект оттенков серого во всех современных браузерах (я думаю, что только IE поддерживает это).Другой метод - использовать два изображения, и при наведении на них появится серое изображение.Что-то вроде this .

Вы можете использовать эффект jquery hover для отображения div, который имеет абсолютную позицию над img.

Что-то вроде: 

$("#YOURIMGID").hover(
  function () {
    $(this).next("#GEARID").show());
  }, 
  function () {
    $(this).next("#GEARID").hide());
  }
);

Ваш HTML будет что-то вроде: 

<div style='position:relative;'>
<img src='image.jpg' alt='' id='YOURIMGID' />
<div style='position:absolute;display:none;' id='GEARID'><img src='gear.png' alt='gear'/></div> 
</div>

пс.не копируйте мой код, лучше использовать css и html ;-), это слишком впечатляет.

...