Как Сделать, Чтобы При Наведении На Товар Появлялась Рамка
#1
Отправлено 28 Январь 2013 - 23:24
Хотелось бы сделать, чтобы при наведении на блок товара - появлялась рамочка 1px как было по умолчанию.
Только раньше по умолчанию товары всегда были выделены рамочкой, а сейчас хотим сделать только при наведении на товар чтобы появлялась.
Сайт http://g-shock24.ru/
Помогите, что изменить в css чтобы при наведении на блок товар он обводился в border ?
#2
Отправлено 29 Январь 2013 - 02:01
.goodsListItemBlock { border: medium none !important; height: 325px; margin: 7px; overflow: hidden; width: 221px; }
и заменить на
.goodsListItemBlock { border: medium none; height: 325px; margin: 7px; overflow: hidden; width: 221px; }
далее найдите
.withBorder { border: 1px solid #E5E5E5 !important; }
и замените на
.withBorder { border: 1px solid #E5E5E5; }
далее найдите
.withBorder:hover { border-color: #FF8D13 !important; }
и замените на
.withBorder:hover { border: 1px solid #FF8D13 !important; }
#4
Отправлено 29 Июль 2013 - 09:24
У меня тот-же вопрос.
только не смогла найти
.goodsListItemBlock {
border: medium none !important;
height:325px;
margin:7px;
overflow: hidden;
width:221px;
}
У меня все, что связано с .goodsListItemBlock
/* Список товаров в виде таблицы. Ячейки с товаром */
.goodsListItem {text-align:center;vertical-align:top;width:195px;overflow:hidden;padding:0px;} /* Размер в 200 пикселей сделан, чтобы и 2 и 5 товаров нормально смотрелись и была возможность увеличить разрешение до 1220 пикселей*/
.goodsListItemBlock {height:300px;width:210px;margin:5px;overflow:hidden;}
/* color: #390 !important;
font: bold 17px/20px Tahoma,Geneva,sans-serif !important;
} */
.goodsListItemBlock a {}
.goodsListItemBlock a span span {color: #390; font-size:17px;font-weight:bold;}
Что из этого менять?
Спасибо.
#5
Отправлено 29 Июль 2013 - 11:43
Джейн (29 Июль 2013 - 09:24) писал:
У меня тот-же вопрос.
только не смогла найти
.goodsListItemBlock {
border: medium none !important;
height:325px;
margin:7px;
overflow: hidden;
width:221px;
}
У меня все, что связано с .goodsListItemBlock
/* Список товаров в виде таблицы. Ячейки с товаром */
.goodsListItem {text-align:center;vertical-align:top;width:195px;overflow:hidden;padding:0px;} /* Размер в 200 пикселей сделан, чтобы и 2 и 5 товаров нормально смотрелись и была возможность увеличить разрешение до 1220 пикселей*/
.goodsListItemBlock {height:300px;width:210px;margin:5px;overflow:hidden;}
/* color: #390 !important;
font: bold 17px/20px Tahoma,Geneva,sans-serif !important;
} */
.goodsListItemBlock a {}
.goodsListItemBlock a span span {color: #390; font-size:17px;font-weight:bold;}
Что из этого менять?
Спасибо.
Повторите пожалуйста вопрос. У Вас могут отличаться темы дизайна.
#6
Отправлено 30 Июль 2013 - 06:11
miyako (29 Июль 2013 - 11:43) писал:
У меня на странице самого товара картинка при наведении выделяется в рамку. Нужно, чтоб в каталоге тоже при наведении выделялась. Шаблон сияние.
http://101korset.ru/.../Длинные-платья
И еще такой вопрос. На разных компах по-разному выглядит панель меню сверху и подвал. У меня шрифт маленький, на других компах - большой. В подвале становится на 2 строчки, в панели "меню" все меню не умещается.На своем компе смотрела в разных браузерах, меняла разрешение экрана - все как было - смотрится одинаково. Как сделать, чтоб на всех компах отображалось одинаково?
#7
Отправлено 30 Июль 2013 - 08:42
Джейн (30 Июль 2013 - 06:11) писал:
http://101korset.ru/.../Длинные-платья
И еще такой вопрос. На разных компах по-разному выглядит панель меню сверху и подвал. У меня шрифт маленький, на других компах - большой. В подвале становится на 2 строчки, в панели "меню" все меню не умещается.На своем компе смотрела в разных браузерах, меняла разрешение экрана - все как было - смотрится одинаково. Как сделать, чтоб на всех компах отображалось одинаково?
1) Найдите код в main.css -
.listing .imagem { position: relative; display: inline; float: left; width: 220px; margin-right: 10px; border: 1px solid #D6D6D6; text-align: center; background: #FFF; padding: 1px;}и замените на:
.listing .imagem { position: relative; display: inline; float: left; width: 220px; margin-right: 10px; border: 0px; text-align: center; background: #FFF; padding: 1px;} .listing .imagem :link {border: 1px solid #D6D6D6;} .listing .imagem :hover { border: 1px solid #FF8D13 !important; }
Джейн (30 Июль 2013 - 06:11) писал:
http://101korset.ru/.../Длинные-платья
И еще такой вопрос. На разных компах по-разному выглядит панель меню сверху и подвал. У меня шрифт маленький, на других компах - большой. В подвале становится на 2 строчки, в панели "меню" все меню не умещается.На своем компе смотрела в разных браузерах, меняла разрешение экрана - все как было - смотрится одинаково. Как сделать, чтоб на всех компах отображалось одинаково?
Можете сделать скриншоты? В каких браузерах Вы проверяли? Какая ОС? От компьютеров это не зависит.
#8
Отправлено 30 Июль 2013 - 08:43
Не откатываю гляньте пожалста.
#9
Отправлено 30 Июль 2013 - 09:04
1 скан - это как выглядит сайт на дочкином компе и на компе у меня на работе.
2 скан - так как это должно выглядеть. На моем буке и на втором рабочем компе.
И сканы подвала сайта
1 скан - это как выглядит сайт на дочкином компе и на компе у меня на работе.
2 скан - так как это должно выглядеть. На моем буке и на втором рабочем компе.
Браузер везде один - гугля хром.
И стрелка вверх на дочкином буке смещена влево. как-то неправильно
#10
Отправлено 30 Июль 2013 - 11:49
Джейн (30 Июль 2013 - 08:43) писал:
Не откатываю гляньте пожалста.
Найдите код -
..listing .imagem { position: relative; display: inline; float: left; width: 220px; margin-right: 10px; border: 0px; text-align: center; background: #FFF; padding: 1px;}и замените на -
.listing .imagem { position: relative; display: inline; float: left; width: 220px; margin-right: 10px; border: 0px; text-align: center; background: #FFF; padding: 1px;} .listing .imagem :link {border: 1px solid #D6D6D6;} .listing .imagem :hover { border: 1px solid #FF8D13 !important; }У Вас в начале две точки было.
#11
Отправлено 30 Июль 2013 - 12:03
.listing .imagem img:hover{border:0px;}
Джейн (30 Июль 2013 - 09:04) писал:
1 скан - это как выглядит сайт на дочкином компе и на компе у меня на работе.
2 скан - так как это должно выглядеть. На моем буке и на втором рабочем компе.
И сканы подвала сайта
1 скан - это как выглядит сайт на дочкином компе и на компе у меня на работе.
2 скан - так как это должно выглядеть. На моем буке и на втором рабочем компе.
Браузер везде один - гугля хром.
И стрелка вверх на дочкином буке смещена влево. как-то неправильно
Попробуйте изменить масштаб в браузер (ctrl+колесико мыши). А также попробуйте очистить кэш. Сейчас у Вас отображается как на скрин 1
#12
Отправлено 30 Июль 2013 - 13:13
miyako (30 Июль 2013 - 11:49) писал:
..listing .imagem { position: relative; display: inline; float: left; width: 220px; margin-right: 10px; border: 0px; text-align: center; background: #FFF; padding: 1px;}и замените на -
.listing .imagem { position: relative; display: inline; float: left; width: 220px; margin-right: 10px; border: 0px; text-align: center; background: #FFF; padding: 1px;} .listing .imagem :link {border: 1px solid #D6D6D6;} .listing .imagem :hover { border: 1px solid #FF8D13 !important; }У Вас в начале две точки было.
Убрала из кода
.listing .imagem :hover {
border: 1px solid #FF8D13 !important;
}
Только после этого пропала вторая рамка. Но терь цвет рамки стал черный, а при наведении голубой, причем как-то выборочно, не у всех картинок. На каких то серая рамка и при наведении ниче не меняется. А мне надо, чтоб у всех основной цвет был светло-серый, а при наведении оранжевый - короче как на странице товара.
#13
Отправлено 30 Июль 2013 - 13:23
miyako (30 Июль 2013 - 12:03) писал:
.listing .imagem img:hover{border:0px;}
Попробуйте изменить масштаб в браузер (ctrl+колесико мыши). А также попробуйте очистить кэш. Сейчас у Вас отображается как на скрин 1
Весь смысл, что у меня отображается как на 2 и 4 сканах (на работе компьютер, дома бук) . Браузер я чистила много раз, у меня так отображается всегда. Я и подгоняла меню с подвалом на такое количество вкладок. Мне вобщем и надо, чтоб отображалось именно как у меня, а не у Вас
Дочка тоже чистила браузер, на буке. На другом рабочем компе я чистила вааще все что можно. Он практически девственный Но там отображается как у Вас. Вероятнее это связано именно с ПО. Меня не устраивает такое отображение
При увеличении масштаба на рабочем компе в меню появляется "Обратная связь" *после вкладки войти в ЛК, на дочкином буке НЕ появляется. Подвал так же остается на двух строчках.
Короче, я наверное путанно объясняю, хотелось бы, чтоб отображалось на всех 4 компах одинаково - как на 2 и 4 сканах Иначе люди не видят "Обратную связь". А убирать какие-то другие вкладки - не хочется. Нужно чтоб вкладки как резиновые, что ли , были. Чтоб распределялись по ширине менюшки и подвала
#14
Отправлено 31 Июль 2013 - 00:37
#15
Отправлено 31 Июль 2013 - 06:15
Сake (31 Июль 2013 - 00:37) писал:
Попробую
У http://forum.storela...er/6387-miyako/ отображается как на 1 скрине (у Вас как на 2)
Цитата
Дело в том, что это надо заходить именно с разных компьютеров. Браузеры одного компьютера показывают одно и то же. У меня есть возможность зайти с 5 разных компов. На трех отображается 2 скан, на двух - 1-й.
У дочки обновила гуглю, почистила кеш - ниче не поменялось. Как не умещались вкладки, так и не умещаются. В эксплорере у дочки верхняя менюшка нормальная, внизу как 2 скан, и вообще все как-то криво. Короче на это забила, у меня эксплорер нормально кажет.
Я б тоже никогда не заметила, что в меню не отображается одна вкладка,если б дочка не сказала, что у нее нет той вкладки, которую я поставила последней. Когда я ее попросила высказать свое мнение, она долго ее искала, не нашла, сильно на меня возмущалась, что я посылаю непонятно куда - вот только тогда я увидела в чем дело.
Мое мнение такое, что вкладки в меню и в подвале нужно сделать "резиновыми", чтоб при любом разрешении экрана, любом ПО и компе они растягивались в нужный установленный диапазон. Может я конечно и не права, но зайдите с нескольких компьютеров, наверняка хоть на одном, но не будет хватать вкладок.
Заранее извиняюсь, если я просто чего-то недопоняла.
#16
Отправлено 01 Август 2013 - 01:45
#mainmenu { font-family: "Gabriola"; } #mainmenu li a { background: url("http://design.101korset.ru/tm_link_border.gif") no-repeat scroll right top transparent; color: #FFFFFF; display: block; float: left; font: bold 12px/40px "Gabriola"; padding-left: 15px; padding-right: 15px; text-decoration: none; text-transform: uppercase; } #footer .left ul li { border-right: 1px solid #666666; color: #333333; display: inline; font: bold 19px "Gabriola"; margin-right: 12px; padding-right: 12px; }
Попробуйте задать другой - безопасный шрифт, возможно это решит данную проблему.
Почитайте
http://habrahabr.ru/post/63343/
http://www.xiper.net...safe-fonts.html
#17
Отправлено 01 Август 2013 - 07:35
#18
Отправлено 01 Август 2013 - 08:11
А то я тож чет наделала, а че - непонятно.
Джейн (30 Июль 2013 - 13:13) писал:
.listing .imagem :hover {
border: 1px solid #FF8D13 !important;
}
Только после этого пропала вторая рамка. С этим кодом отображается 2 рамки (большая и маленькая) . Но терь цвет рамки стал черный, а при наведении голубой, причем как-то выборочно, не у всех картинок, а где-то 2 с черной, одна с серой. На каких то серая рамка и при наведении ниче не меняется. А мне надо, чтоб у всех основной цвет был светло-серый, а при наведении оранжевый - короче как на странице товара.
#19
Отправлено 02 Август 2013 - 00:17
.listing .imagem :link {border: 1px solid #D6D6D6;}
и замените на
.listing .imagem {border: 1px solid #D6D6D6;} .listing .imagem:hover {border: 1px solid #FF8D13 !important;}
#20
Отправлено 02 Август 2013 - 00:56
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных