Ролловер на «слоистый» элемент ... возможно? - PullRequest
1 голос
/ 04 сентября 2010

Как бы я поступил следующим образом, предпочтительно просто используя CSS (но, возможно, и jquery) и PHP.

У меня есть область div, button_background, в которой есть фоновое изображение.Внутри этого div находится тег A, который имеет фон, который перекрывает фон div.(это полупрозрачный треугольник png воспроизведения, который накладывает стоп-кадр из видео).Я хотел бы изменить фон тега A (на более темный треугольник) при наведении курсора.

С:

-------------
| ($still)  |
|     \     |
|      \    |
|      /    |
|     /     |
-------------

На

-------------
| ($still)  |
|    *\     |
|    **\    |
|    **/    |
|    */     |
-------------

Обратите внимание, что ягенерируя это из PHP, и URL фонового изображения кнопки является переменной с именем $ still.

Вот грубый html:

<div class="button_background">
  <a class="button_overlay" href="page.html"></a>  
</div>

1 Ответ

1 голос
/ 04 сентября 2010

Вы можете использовать более темное изображение для начала и установить начальное состояние в CSS с меньшей непрозрачностью.

a.button_overlay { background:url(images/triangle.png); opacity:0.5;}

при наведении измените непрозрачность на 1, IE будетнужно свойство фильтра, специфичное для MS.

Вы также можете просто использовать спрайт-изображение (как темную, так и светлую версии треугольника в одном и том же PNG-изображении) и просто изменить положение фона при наведении курсора.

...