Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: hover

 PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
etoYA
Отправлено: 02 Марта, 2012 - 14:05:28
Post Id



Участник


Покинул форум
Сообщений всего: 1859
Дата рег-ции: Июль 2011  
Откуда: Крым


Помог: 21 раз(а)




В общем у меня такая стркутура -

Блок 1 - картинка
Блок 2 - текст (display: none)
При наведении на блок1

CODE (html):
скопировать код в буфер обмена
  1.  
  2. #блок1:hover {
  3.      opacity: 0.2;
  4. }
  5.  


Но нужно, чтобы значение блока2 display: none изменилось в display: block
Пробовал так:

CODE (html):
скопировать код в буфер обмена
  1. #блок1:hover #блок2 {
  2.  
  3. }
  4. #блок2 {
  5.      display:block;
  6. }
  7.  
  8.  

но ничего не вышло, почему?
 
 Top
Panoptik
Отправлено: 02 Марта, 2012 - 14:17:23
Post Id



Постоянный участник


Покинул форум
Сообщений всего: 2493
Дата рег-ции: Нояб. 2011  
Откуда: Одесса, Украина


Помог: 131 раз(а)




а html какой? как расположены блоки относительно друг друга?


-----
Just do it
 
 Top
armancho7777777 Супермодератор
Отправлено: 02 Марта, 2012 - 14:22:27
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)




CODE (html):
скопировать код в буфер обмена
  1.  
  2. #блок1:hover #блок2 {
  3.  
  4.  display:block;
  5.  
  6. }
  7.  
  8.  

(Отредактировано автором: 02 Марта, 2012 - 14:22:57)

 
 Top
DelphinPRO
Отправлено: 02 Марта, 2012 - 14:29:13
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)




etoYA пишет:
Блок 1 - картинка
Блок 2 - текст (display: none)
При наведении на блок1


намного информативнее привести пример html кода

CODE (html):
скопировать код в буфер обмена
  1. <a>
  2.     <img src=""/>
  3.     <span>text</span>
  4. </a>


CODE (html):
скопировать код в буфер обмена
  1. span {display:none;}
  2. a:hover span {display:block;}


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
etoYA
Отправлено: 02 Марта, 2012 - 14:29:31
Post Id



Участник


Покинул форум
Сообщений всего: 1859
Дата рег-ции: Июль 2011  
Откуда: Крым


Помог: 21 раз(а)




armancho7777777, пробовал офк...
(Добавление)
CODE (htmlphp):
скопировать код в буфер обмена
  1. #films ul li {
  2.         display: inline-block;
  3. }
  4. #films ul li img {
  5.         margin: 33px 0;
  6.         width: 200px;
  7.         height: 132px;
  8.         border: 1px dotted #777;
  9. }
  10. #films ul li a h2 {
  11.         position: absolute;
  12.         top: 135px;
  13.         width: 200px;
  14.         text-align: center;
  15.         color: #fff;
  16.         display: none;
  17. }
  18. #films ul li a h2:after {
  19.         position: absolute;
  20.         top: -85px;
  21.         left: 55px;
  22.         width: 90px;
  23.         height: 70px;
  24.         background: url('../img/films-h.png');
  25.         content: '.';
  26. }
  27. #films ul li a img:hover {
  28.         opacity: .2;
  29. }
  30. #films ul li a img:hover  ul li a h2{
  31.         display: block;
  32. }


CODE (htmlphp):
скопировать код в буфер обмена
  1. <li><a><img src="/files/posters/5.jpg" /><h2>HIHI</h2></a></li>
 
 Top
DelphinPRO
Отправлено: 02 Марта, 2012 - 14:35:56
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)




etoYA пишет:
#films ul li a img:hover ul li a h2{
display: block;
}

такая запись не имеет смысла, так как подразумевает наличие тега UL внутри тега IMG, чего быть не может - тег IMG одиночный, не является контейнером.
(Добавление)
CODE (css):
скопировать код в буфер обмена
  1. #films ul li a:hover img {
  2.         opacity: .2;
  3. }
  4.  
  5. #films ul li a:hover h2 {
  6.         display: block;
  7. }


вот так надо

(Отредактировано автором: 02 Марта, 2012 - 15:23:37)



-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
etoYA
Отправлено: 02 Марта, 2012 - 14:37:47
Post Id



Участник


Покинул форум
Сообщений всего: 1859
Дата рег-ции: Июль 2011  
Откуда: Крым


Помог: 21 раз(а)




Пробовал и без него..
(Добавление)
DelphinPRO, тю блин, был пробел между a и :hover ......
 
 Top
Panoptik
Отправлено: 02 Марта, 2012 - 14:44:02
Post Id



Постоянный участник


Покинул форум
Сообщений всего: 2493
Дата рег-ции: Нояб. 2011  
Откуда: Одесса, Украина


Помог: 131 раз(а)




CODE (css):
скопировать код в буфер обмена
  1.  
  2. #films ul li {
  3.         display: inline-block;
  4. }
  5. #films ul li img {
  6.         margin: 33px 0;
  7.         width: 200px;
  8.         height: 132px;
  9.         border: 1px dotted #777;
  10. }
  11. #films ul li a h2 {
  12.         position: absolute;
  13.         top: 135px;
  14.         width: 200px;
  15.         text-align: center;
  16.         color: #fff;
  17.         display: none;
  18. }
  19. #films ul li a:hover h2 {
  20.         display: block;
  21. }
  22. #films ul li a:hover img {
  23.         opacity: 0.2;
  24. }
  25.  


-----
Just do it
 
 Top
IllusionMH
Отправлено: 02 Марта, 2012 - 14:57:02
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)




Если ориентировать на 1 пост, то
CODE (CSS):
скопировать код в буфер обмена
  1. #block1:hover + #block2 {
  2. display: block;
  3. }

(Отредактировано автором: 02 Марта, 2012 - 15:00:45)

 
 Top
DelphinPRO
Отправлено: 02 Марта, 2012 - 15:26:23
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)





IllusionMH, сестринский селектор требует танцев с бубном в IE Улыбка
рекомендовать его человеку, плохо разбирающемуся в CSS - садизм Улыбка


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
IllusionMH
Отправлено: 02 Марта, 2012 - 16:07:36
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)





DelphinPRO, ну я забил на то, чтобы вид документа в ИЕ6-7 был такой же как и у норм браузеров, т.к. у меня нет возможности на виртуале его мучать, а IETester не всегда адекватно отображает поведение "реального" ИЕ7.
В ие7 это просто можно прочесть, без "красивостей" и эффектов.
P.S. Он вроде соседский (sibling), а не сестринский Подмигивание

Я и написал, что только если смотреть на первое сообщение. (вдруг пригодится на будующее
)
Правильное решение действительной проблемы(отличается от описанной в первом посте) указанно DelphinPRO и Panoptik.

(Отредактировано автором: 02 Марта, 2012 - 16:09:11)

 
 Top
etoYA
Отправлено: 02 Марта, 2012 - 19:48:18
Post Id



Участник


Покинул форум
Сообщений всего: 1859
Дата рег-ции: Июль 2011  
Откуда: Крым


Помог: 21 раз(а)




Не парьтесь, я на IE 6-7 забил, и просто не буду выводить содержимое этому браузеру..

Так как у меня и PNG и много чего, что не поддерживает этот ВРОДЕ КАК браузер)
 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« HTML, Дизайн & CSS »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB