Search the Community
Showing results for tags 'hover'.
-
надо сделать вот так: а получается вот так: доп материалы с кодом:
-
Подскажите, пожалуйста, что прописать в коде для изменения цвета шрифта меню при наведении на БЛОК (не на ссылку) с черного на белый при hover. На скрине цвет меняется при наведении на ссылку. И как можно меню отодвинуть влево? Заранее спасибо! <div class="three navigation items"> <nav> <ul> <li> <div class="navigation__item"></div> <a href="#">Hot themes</a> </li> <li> <div class="navigation__item"></div> <a href="#">EURO-2016 Playoffs</a> </li> <li> <div class="navigation__item"></div> <a href="#">El'Classico</a> </li> </ul> </nav> </div> .navigation { background-color: rgba(31, 30, 30, 0.438); width: 900px; height: 30px; } .navigation li { display: inline-block; padding: 5px 15px; &:hover { content: ""; background-color: rgb(36, 36, 36); cursor: pointer; } } a { color: black; text-decoration: none; font-family: sans-serif; &:hover { content: ""; color: white; } }
-
Закругление фона у :hover при наведении на строку таблицы
Tanya2021 posted a question in HTML Coding
Не могу закруглить углы у background-color. В чем проблема? -
Добрый вечер, ребята. Вторые сутки блуждаю в сети и не могу найти ответ на свой вопрос. .niz:hover { background: red; этим кодом я получил возможность менять цвет определенного блока наведением курсора, вопрос в следующем. Как делать, что бы после каждого наведения цвет менялся на другой а не на один и тот же. То есть зеленый, красный, оранжевый и так далее, спасибо большое
-
Привет всем .Может кто-то сможет помочь, я не знаю как подвинуть span А. сделать его круглым и поставить по центру картинки , как в премере на картинке.Спасибо за ранее.https://jsfiddle.net/m05gfxqb/1/ css DZ.zip
-
Люди добрые, помогите разобраться, весь день пытаюсь понять почему у меня не получается. В общем идея была сделать одну красную кнопку, чтобы при наведении появлялось еще 4 зеленых. Реализовать попытался 2мя очень похожими способами, через div и через список. https://codepen.io/lokonaft/pen/GXqBBP - в данном случае почему то не работает transition https://codepen.io/lokonaft/pen/qMNMVL - в данном случае я то ли не могу правильно задать hover, то ли я чего то не понимаю
-
Здравствуйте. Недавно начал изучать HTML и CSS. Хочу сделать рядом 2 блока div которые при наведении на любой из них увеличивались в ширине и изменяли ширину соседнего. А получается что при наведении на блок А он увеличивается и уменьшает ширину блока Б. А при наведении на блок Б он просто увеличивается и перекрывает блок А https://jsfiddle.net/ob4jyz0p/1/ Для наглядности: Курсор не в области этих блоков: |________А_50%________| |________Б_50%________| Курсор наведен на блок А: |____________А_80%____________| |____Б_20%____| Курсор наведен на блок Б: (Перекрывает Блок А) |____А_50%____|____________Б_80%____________|
-
В меню мигает белый фон hover не могу понять откуда он берется. И что самое интересно что водишь по пунктам горизонтально ! Помогите найти как его поменять.
-
Добрый вечер. Подскажите пожалуйста как hover 1 элемента менять стили другого? вот пример, почему то не работает... https://jsfiddle.net/Beoulve/zgvw2t8k/ может я вообще не так все делаю и проще скриптами делать или другим методом. p.s. пытался включить div блоки в список li что бы hover заработал, но тогда опасити 1 ставится даже когда на сам блок наводишь, а не только на элемент меню. upd. https://jsfiddle.net/zgvw2t8k/4/ вот пример поновее... upd.2. https://jsfiddle.net/Beoulve/zgvw2t8k/5/ получилось, но, когда курсор уходит с ссылки, блок пропадает, хотя если курсор переходит на блок, блок должен оставаться.
-
Здравствуйте. Не могу никак понять как сделать подобного вида меню(Как в приложении). Пробовал через display:none->display:box; , через opacity:0->opacity:1; теперь через transform:scale(0.5); -> transform:scale(2); <!doctype html> <html> <head> <meta charset="utf-8"> <title>Документ без названия</title> <link href="about.css" rel="stylesheet" type="text/css"> </head> <body> <div class="menu"></div> <div class="show-menu"></div> </body> </html> Задача такая чтобы при наведении курсора на центральный элемент, круговое меню появлялось как-бы вокруг него. Вот одна из попыток : html CSS .menu { width:100px; height:100px; background:orange; transform:scale(0.5); } .menu .show-menu:hover { transform:scale(2); } .show-menu { width:50px; height:50px; background:black; position:absolute; top:33px; left:33px; }
-
Вобщем есть код <div class="number"> <a href='#'><img src='images/Call.png' class="call"></a> <b>8-905-282-60-55</b> </div> изначально тег <b> скрыт display:none; хочу что бы при наведении на ссылку тег <b> снова становился видимым. насписал стили: .number b{ display:none; } .number a:hover b{ display:block; } Но нечего не работает в чем проблема подскажите.
-
При наведении на .tabs-link у .tabs-link:after должно появляться свойство visibility: visible; http://codepen.io/anon/pen/XdwJaG
-
Помогите с проблемой. Есть один большой блок с классом "list", внутри которого должна отображаться информация с помощью блока "mininfo". Задача: сделать так, чтобы при наведении на любую область блока "list" появлялся блок "maxinfo", в котором будет отображена более полная информация. Пытаюсь реализовать это через изначальное значение 0 параметра "opacity" в блоке "maxinfo" и стиля .list:hover+.maxinfo, который даст при наведении "opacity: 1". При наведении на блок "list" ничего не происходит. Но, когда я проделываю то же самое с блоком "mininfo" (.mininfo:hover+.maxinfo) - все работает отлично. После почти суток проб и ошибок, пришел к выводу, что такое вероятнее всего может быть, потому что "maxinfo" - это блок внутри блока "list", а "mininfo" - нет. Кто сталкивался с такой проблемой, расскажите действительно ли дело в этом, либо я что-то упускаю? И самое главное, как правильно и грамотно сделать такое действивие е при наведении мыши, желательно средствами css, если это возможно.
-
Добрый день. Столкнулся со странной ситуацией: В главном верхнем меню сайта aviado.ru, при наведении мышкой на выпадающее меню, значение hover (background: #be1d1d url(images/back_menu_hover.png) repeat-x top left;) не до конца заполняет область раздела (см. скриншот). Любопытно, что в других браузерах (Firefox, Yandex, Opera) всё работает корректно, включая мобильные браузеры. Собственно и в Chrome все работало корректно, до версии 45.0.2454.85 m. Нюанс: такой косяк происходит только с выпадающим меню, т.е в тех областях, где меню не выпадает, а просто кнопка, заполнение происходит нормально. Проблема была диагностирована на 5 компьютерах под управлением Windows 8 и Windows 10. Вот как та же ситуация выглядит, например, в браузере Yandex: Честно говоря, перерыл уже все возможные варианты. Ответа не нашел. Буду благодарен за советы и помощь.
-
Создал div - скрыл его left: -50%; Теперь хочу при нажатии на красненькую кнопу его показать , но работать не хочет , вот от основного блока в котором они находятся все работает а от кнопочки нет ! подскажите пож как реализовать нажимая на кнопку что бы блок выезжал !? .knopka:hover > .blol-blok-text {left: -10%;}
-
Есть два адаптивных изображения При наведении должно быть так: Как это сделать? http://codepen.io/anon/pen/VLdpvN
-
Здравствуйте! Нужно чтобы при наведении на блок 1 менялось оформления блока 2. Это всё происходит на одной странице, но блоки не вложены друг в друга, они в разных частях документа. Есть ли у кого готовый скрипт? Спасибо!
-
Всем привет! Подскажите, как можно сделать такой вот эффект: http://joxi.ru/n2YY0kKcwb5526- левая картинка без ховера, правая с ховером. Может, кто делал подобное, кажется, что не трудно, но нормальных идей нет=( Заранее, спасибо!
-
Добрый день, дорогие форумчане! Нужно сделать ховер-эффект у иконки соц-сети. Он заключается в следующем: 1) До наведения - http://joxi.ru/VrwpeqgubwyEmX 2) После наведения - http://joxi.ru/v297yWjU9XBgrG Но раз это изображение, то у него нельзя поменять цвет фона. Уместно ли будет сделать так, чтобы менялось фоновое изображение блока. То есть создать блок, у которого background-image при наведении будет менять свое значение. Или есть другие правильные способы реализации? Например использовать специальный шрифт для иконок соц-сетей. Всем спасибо!
-
Проблема следующая. При наведении на пункт меню "Услуги" в мазиле выпадает меню второго уровня с перечнем услуг, собственно как и должно. А при наведении на этот же пункт меню в хроме, меню второго уровня так же появляется, но при попытке наведения на одну из услуг меню исчезает. В чем тут проблема? Почему эффект hover пропадает в хроме, а в мазиле работает? Вот сайт: http://www.gruzchiki-tver.ru
-
Съезжает выделение, появляющееся при наведении курсора
sitemaker999 posted a question in HTML Coding
У меня баг (скрин под спойлером): Как видите, красное выделение съезжает до первой линии. Как это лечится? Код: HTML: CSS: -
Не подскажите есть ли универсальное средство, чтобы сделать такой hover http://clip2net.com/s/39WPtxB непосредственно css. То есть нужно чтобы автоматически под ширину слова подстраивался;непосредственная длина эффекта 90px, если пункт меню имеет большую ширину получается кривовато(((
-
Здравствуйте. Имеется 6 кружков и один большой (центральный, с div hover эффектом). По нажатию на один из шести кружков, центр.блок меняет контент http://shure-kryg.ru/tttest/1/
-
Подскажите, пожалуйста, как сделать такой hover http://clip2net.com/s/39RXeg1. Нужно, чтобы он автоматически подстраивался под содержимое.
-
Подскажите как решить следующую проблему, есть li в нём div, при наведении мыши к диву должен применится hover, но он применяется только к вложенным блокам а не к родительскому диву! то есть бэкграунд меняется например у 'news_title_header' когда мышка находится на нем, а у всего 'news_parent' не меняется. такая конструкция <li> <div class="news_parent"> <div class="news_title_header"> <a data-post="5" href="news/novost-3">Новость 3</a> <i class="c_time">01.11.2014</i> </div> <div class="news_short"><p>краткое описание</p></div></div></li>стиль: #news li {margin-bottom: 5px;padding: 5px;background: rgb(252, 252, 252);border-radius: 5px;}#news .news_parent:hover { background: rgb(229, 255, 238);}получается так: а должно быть так:
