Вход

Просмотр полной версии : Фон и текст при наведение на картинку.


salofun
10.05.2014, 22:02
Привет, друзья.
В jscript я дубок, поэтому прощу помощи, мне нужен скрипт, чтобы при наведение мыши на картинку на нее накладывался:
background: rbga(0,0,0,.3);
И в центре блока:

<p>Заголовок</p>
<p>Текст</p>


p.s Цвет и текст я подкорректирую, по желанию можете добавить анимации какой-нибудь.
В итоге нужен такой результат при наведение на картинку -

alex.vv
10.05.2014, 22:52
Без полного кода это гадание на кофейной гуще.
А вообще то, что вы хотите, можно сделать на CSS3 проще и быстрее.

salofun
11.05.2014, 13:33
1. Зачем вам полный код? Ну ладно:
<div id="#block_54">
<img scr="blabla.jpg"></img>
</div>
#block_54{
height: 200px;
width: 200px;
}

2. На css нельзя, потому-что нет возможности подключить их в конструктор, только JS.

Aetae
11.05.2014, 13:39
salofun,
нужен нормальный полноценный свёрстаный код до и после. Чтобы понять, что вообще делать, ибо сейчас вот нифигушечки непонятно.

salofun
11.05.2014, 14:08
Можете сказать, как задать CSS свойство, через JS по ID элемента?
К примеру мне нужно добавить к элементу #block-new40 вот такое:
#block-new40:hover{
opacity:1;
}

salofun
11.05.2014, 16:06
var backGround = 'rgba(51,159,226,0)';
$('#block-new40').hover(function(){
startOpacity = parseFloat($(this).css('background'));
$(this).css('background', 'rgba(51,159,226,.67');
}, function(){
$(this).css('background', backGround);
});

var startOpacity = 0;
$('#block-new40').hover(function(){
startOpacity = parseFloat($(this).css('opacity'));
$(this).css('opacity', '1');
}, function(){
$(this).css('opacity', startOpacity);
});|

Решил так.