nikki4

Сайт

При нажатии на "бутерброд" (меню) - на андроидах все ОК, а вот на 6 и 7 айфоне смотрели - говорят, что меню перекрывается баннером/контентом.

В чем дело?

Выше что-то не понятно. аутлайн не помог.

Но я нашел решение тут:

http://jsfiddle.net/achudars/8wW74/

Пишу

.filter label input {
border:none; 
border-radius:0; 
-webkit-border-radius:0; 
-moz-border-radius:0;
}
}

чищу кеш. всеравно выглядят скругленно

Дизайнер нарисовал, что в обычной версии - размер одежды выбирается кнопками. А в мобильной версии, кнопки превращаются в список (дизайнер вдохновился этим сайтом)

Но я не пойму как реализовать это. На том движке что делаю (опенкарт) опции одежды выбрал радиокнопки. Можно ли их каким-то образом теперь превратить в список?

вижу пока только 1 вариант - дублировать опции. На компьютере показывать одни и скрывать вторые и наоборот.

Или может как-то можно это в css сделать?

Задача такая - при наведении на пункт меню "каталог" - появились 3 картинки с разделами каталога по которым можно было бы перейти в соответствующий раздел (вот типа как тут).

Проблема в том, что как только убираю курсор с .imagetip - все опять скрывается. Как сделать чтобы не исчезало?

Нужно сделать отступы блока яндекс карты - поплыли значки на ней. Решил убрать ее в блок и двигать уже блок

но не отображается. Пробовал убрать float:left -тогда карта появляется. Но если не сделать float:left. тогда блок справа будет снизу, а не справа от карты

Сам спросил сам отвечу

надо было фиксированный блок сделать по высоте/ширине.

Я это сделал - но опечатался, потому не мог понять, в чем еще могло быть дело

Нужно сделать как на картинке. Как это правильно сделать?Вот что у меня получилось, но нужно каким-то образом убрать границу снизу под текстом

При наведении на кнопку - все куда-то движется. Если же границу оставить при наведении в 1px - тогда все ок, но стоит указать
border:2px solid black; - и все смещается

Что тут поправить?

Пришлось изменить вывод html

Попробовал так, но не вышло

Как сделать, что если выбрана радиокнопка, тогда лейблу присвоить такой-то стиль?

<div class="radio">
<label><input name="option[10]" value="45" type="radio">50</label>
</div>

недавно задавал похожий вопрос
только там была картинка, а не цифра

input[type="radio"]:checked ~ img {

Попробовал по аналогии:

input[type="radio"]:checked ~ label {

но не сработало

https://goo.gl/ygY6HF

3 колонки, сейчас каждая по 33% в ширину.

Но логотип #logo по середине почему-то криво стоит по отношению к меню, которое отцентровано при помощи text-align:center;. Можно конечно логотипу  margin-left: 30px; сделать - но это вроде как не адаптивный вариант и придется под разные разрешения разные отступы делать.

Внизу, справа - есть отзывы (надо кликнуть на слово "отзывы (6)"

При клике на вторую страницу отзывов - перекидывает вниз. Я так понимаю это связанно с якорем.

Как сделать, чтобы это нормально работало, и при клике - оставался экран статичным, либо перекидывало наверх к началу отзывов, а не как сейчас - отправляет куда-то вниз?

Причем при переходе со второй страницы на первую - работает как надо.

Нашел как скрыть кружок кнопки, но как сделать, чтобы при переключении цвета у картинки появлялась рамка?

т.е. чтобы было понятно какой текущий цвет выбран.

<div class="form-group required">

<div id="input-option232">
<div class="radio">
<label> <input name="option[232]" value="37" type="radio">						
<img src="http://zohen.ru/image/cache/catalog/colors/black-50x50.jpg" alt="Черный" class="img-thumbnail"> Черный </label>
</div>

<div class="radio">
<label>
<input name="option[232]" value="38" type="radio">
<img src="http://zohen.ru/image/cache/catalog/colors/red-50x50.jpg" alt="Красный" class="img-thumbnail"> Красный </label></div>
</div>
</div>

http://www.cssdesk.com/PmGYM

пробовал так, но не сработало:

input[name="option[232]"]:checked img {

нужно для аккордиона, пока использую картинки - но понимаю, что оптимальнее сделать это символами

вот нужен "+" , вместо картинки крестика

.accordion-header li
{
background:url("") no-repeat;
background-position:right;
}

Взял за основу такой аккордион:

http://ruseller.com/lessons.php?rub_id=2&id=1195

Начал вставлять его в движок, но чето работает не так как в демке, при клике экран смещается

http://cssdeck.com/labs/upg89em0

Как сделать чтобы экран не скакал?

Или может подскажите другой рабочий аккордион с похожим эффектом? (плавное раскрытие при клике на один из пунктов и закрытие другого пункта)

Нашел еще один скрипт и тоже не работает...

Нашел третий скрипт - он заработал. Но там надо jquery подключать в начале

Разобрался. Это шрифт специальный. Font Awesome Icons

.fa-pinterest::before {

    content: "";

}

А чтобы инвертировать цвет написал:
 

background: black;

    color: white;

11 минуту назад, npofopr сказал:

Похоже на http://www.elevateweb.co.uk/image-zoom/examples

уже видел, чем похоже?

надо чтоб при клике открывалось - и все можно было во весь экран рассмотреть, есть Gallery & Lightbox. Но там зума нет  в лайтбоксе.

вот еще удалось найти нечто подходящее, но тут при не удобно зум работает - нужно нажимать ан лупу, а колесико крутит слайды. Даже пальцами с мобильного не срабатывает зумирование

https://sachinchoolur.github.io/lightGallery/

Есть такая страничка карточки товара

Где взять такой скрипт, чтобы открывалось на весь экран с большим зумом, и можно было еще листать картинки.

Попробовал сохранить страничку и методом тыка выяснить - но при открытии тут же пропадают фотки. начал смотреть код и гуглить

ZoomGallery - но чето не нашел именно такой. Чтоб каждую детальку в одежде можно было посмотреть.

Подскажите пожалуйста  такой или похожий скрипт, кстати в мобильной версии все это в слайдер или еще как-то укомпоноваться должно как там.

кстати нашел сайт где ооочень много всяких зумов. В т.ч. то что надо, все супер

http://www.ajax-zoom.com/examples/example32_responsive_vertical.php

если бы не цена... от 500 евро и выше на 1 домен!

http://www.jqueryscript.net/tags.php?/image zoom/

http://jsbin.com/fajecuzome/edit?html,css,output

Вот : картинки расположены на разных уровнях. Для этого делаю фиксированную высоту для заголовка. Но как теперь там отцентрировать текст?

Из-за разной высоты заголовков едут картинки, из-а чего не красиво. Потмоу решил их сжать до фиксированной позиции, но как теперь выровнять все по центру?

<div class="title">Заголовок</div>
<div class="title">Длинный загогловок в две строчки</div>

.title {
  width:200px;
  height:40px;
  background:pink;
  border:1px solid;
  float:left;
  margin-left:5px;
  text-align:center;
}

http://jsbin.com/lunizoguqu/edit?html,css,output

решение вопроса

https://jsfiddle.net/0y992bav/

2 часа назад, ows.nightwolf сказал:

http://jsbin.com/nodoqesala/edit?html,js,output

Спасибо. А что значит value + color?

var activeField = this.selectedOptions[0].value+'_color';?

Пытаюсь адаптировать Ваш код под реальную форму. Но что-то не работает. Видимо это из-за _color, но на что его поменять

http://jsbin.com/towivixopa/edit?html,js,output

т.е. есть выбран 1 пункт из списка, скрыть последние 2 поля и отобразить 1

если выбран второй пункт. то скрыть 1 и 3 поле, отобразить 2

если выбран 3 пункт - отобразить все

есть обычный список, и пару текстовых полей. Как делается так, что при выборе "красного" автоматически активируется поле куда надо ввести что-то красное, а поле для зеленого - скрыто. как только выбирается зеленый цвет, то красное поле пропадает, и предлагают ввести зеленое

<select name="color">
<option value="red" >красный/option>
<option value="green">зеленый</option>
</select>

<input type="text" name="red_color" value="введите что-то красное"  />
<input type="text" name="green_color" value="введите что-то зеленое" />

Сделал мобильную версию сайта. Проверил в разных браузерах. Зашел с телефона - все ОК.

Запустил проверку гугла на мобильность

а он криво видит контент. что не так?

Есть список новостей

Задача к списку подписать сверху "Новость":
 

Цитата

 

Новость1

бла бла бла

дата

 

Новость2

бла бла бла

дата

 

копал в водпрессе последние записи и не найду код где можно вставить перед li слово новость.

Подумал, а может в css можно как-то  это сделать?

знаю, что можно как-то картинку вставить. А можно ли чтобы цифра оставалась. а при этом картинка добавлялась?