[Помогите] Дефолтная тема - обводка при наведении?

Тема в разделе "OpenCart", создана пользователем wwizard, 29 ноя 2013.

  1. wwizard

    wwizard

    Регистрация:
    20 мар 2013
    Сообщения:
    50
    Симпатии:
    1
    Создал сайт на основе дефолтной темы.
    не могу сообразить как сделать некоторые вещи:
    1. При наведении мышки на любой товар с модуля "Рекомендуемые" чтобы чуть приближался товар и вокруг него появлялась синяя каемка.
    2. Выделить поиск товара, чтобы он бросался в глаза
    3. В карточке товара, очень много пустого места, а хочется чтобы там чтото было. Что можно туда подставить?
    4. Где можно найти картинки для категорий товаров чтобы они выдерживали хоть какойто стиль?
     
  2. Владимир Z

    Владимир Z

    Регистрация:
    12 янв 2013
    Сообщения:
    73
    Симпатии:
    28
    Первые три пункта - это верстка. Последний это очень субъективно.
    Не правильный подход: луче бы спросили сколько стоит сделать - для вас самое оно.
     
  3. wwizard

    wwizard

    Регистрация:
    20 мар 2013
    Сообщения:
    50
    Симпатии:
    1
    Логично. тогда спрошу, сколько стоит сделать это за меня?
     
  4. halfhope

    halfhope

    Регистрация:
    31 дек 2012
    Сообщения:
    285
    Симпатии:
    312
    Чтобы появилась синяя рамка достаточно немного поправить стили, например, добавить в stylesheet код:
    Код:
    .box-product > div:hover {
        box-shadow: 0px 0px 3px 1px rgb(56, 176, 227); //цвет #38B0E3
    }
    Можете посмотреть реализацию на http://oc.halfhope.ru/
    А вот с zoom будет посложнее, там много писать надо.
    Тоже много писать, но все можно реализовать
    Можно добавить изображение производителя и заголовок товара сместить в правую сторону.
    Опять же можете посмотреть реализацию на http://oc.halfhope.ru/index.php?route=product/product&path=20&product_id=40.
    В поиске по картинкам в Google, вероятнее всего найдете там картинку под свой магазин, либо нанимайте дизайнера, пусть фотографирует или рисует. А для первых пунктов рекомендую нанять веб-дизайнера.
     
    HPlus нравится это.
  5. Reqman

    Reqman

    Регистрация:
    25 фев 2013
    Сообщения:
    213
    Симпатии:
    62
    Открывайте файл стилей и делайте соответсвующие правки. Когда увидеть результат правьте уже на голубую коемочку.
    Для .box-product > div {
    Код:
    .box-product > div {
      width: 152px;
      display: inline-block;
      vertical-align: top;
      margin-left: 7px;
      margin-right: 7px;
      margin-bottom: 15px;
      padding: 10px;
      background: #fff;
      text-align: center;
    }
    Для .box-product > div:hover {
    Код:
    .box-product > div:hover {
    
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0px 0px 10px 0px #ddd ;
    -webkit-border-radius: 7px 7px 7px 7px;
    -moz-border-radius: 7px 7px 7px 7px
    -khtml-border-radius: 7px 7px 7px 7px;
    border-radius: 7px 7px 7px 7px;
    padding: 9px;
    }
    С остальными вопросами смогу помочь, если предоставите пример.
     
    wwizard нравится это.
  6. wwizard

    wwizard

    Регистрация:
    20 мар 2013
    Сообщения:
    50
    Симпатии:
    1
    Спасибо, поиграюсь.