0 Пользователей и 1 Гость просматривают эту тему.
  • 12 Ответов
  • 382 Просмотров
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
Как сделать что бы картинка увеличивалась при наведении курсора?
*

Филипп Сорокин

  • Сорокин Band
  • 1833
  • 148 / 4
И вам добрый вечер. Средствами CSS:

Код: css
img {
    transition: width 2s;
}

img:hover {
    width: 1000%;
    height: 1000%;
    max-width: 1000%;
}
« Последнее редактирование: 30.06.2016, 19:46:24 от Филипп Сорокин »
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
И вам добрый вечер. Средствами CSS:

Код
img {
    transition: width 2s;
}

img:hover {
    width: 1000%;
    height: 1000%;
    max-width: 1000%;
}

Добрый вечер) А куда ставить код?
*

Филипп Сорокин

  • Сорокин Band
  • 1833
  • 148 / 4
А без разницы - куда больше нравится :)
В конец любого файла CSS. Если не сработает, то попробуйте так:

Код: css
img {
    transition: width 2s;
}

img:hover {
    width: 1000% !important;
    height: 1000% !important;
    max-width: 1000% !important;
}
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
А без разницы - куда больше нравится :)
В конец любого файла CSS. Если не сработает, то попробуйте так:

Код: css
img {
    transition: width 2s;
}

img:hover {
    width: 1000% !important;
    height: 1000% !important;
    max-width: 1000% !important;
}

Мне надо что бы верхние картинки увеличивались если на них наводят курсор.
вот ссылка vyveska1.ru/vyveski
Сейчас сделано одной целой картинкой, но буду заливать по одной.
Вывод на страницу будет ч/з HTML код.
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
А без разницы - куда больше нравится :)
В конец любого файла CSS. Если не сработает, то попробуйте так:

Код: css
img {
    transition: width 2s;
}

img:hover {
    width: 1000% !important;
    height: 1000% !important;
    max-width: 1000% !important;
}

Может подскажите хотя бы в какую папку.
И мне не надо что бы это правило распространялось на все картинки на сайте.
Надо что бы только на конкретные в коде HTML
« Последнее редактирование: 30.06.2016, 19:53:25 от Galina2307 »
*

Филипп Сорокин

  • Сорокин Band
  • 1833
  • 148 / 4
Надёжнее всего сразу вставить код в индексный файл Вашего шаблона - так сработает наверняка!

Код
/templates/ваш_шаблон/index.php

Открываете его и вставляете php код в начало файла после строки defined('_JEXEC') or die()

Код: php
/templates/ваш_шаблон/index.php

собственно, код:

Код: php
JFactory::getDocument()->addStyleDeclaration("
    img {
        transition: width 2s;
    }
 
    img:hover {
        width: 1000% !important;
        height: 1000% !important;
        max-width: 1000% !important;
    }
");
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
Ничего не получилось. Вопрос актуален 
*

fbr

  • Завсегдатай
  • 1276
  • 148 / 6
Код: css
a:hover img {
    transform: scale(1.1);
}
a {overflow:hidden;}
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
Код: css
a:hover img {
    transform: scale(1.1);
}
a {overflow:hidden;}


Это куда?
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
Нужно что бы увеличивались только картинки которые стоят сразу под горизонтальным меню.
сайт vyveska1.ru
*

fbr

  • Завсегдатай
  • 1276
  • 148 / 6
В стилевой файл вашего шаблона:
Код: css
.vt_moduletable_content img {
    transform: scale(1.0);
    transition: all .3s;
}
.vt_moduletable_content img:hover {
    transform: scale(1.1);
}
*

Galina2307

  • Захожу иногда
  • 117
  • 0 / 0
В стилевой файл вашего шаблона:
Код: css
.vt_moduletable_content img {
    transform: scale(1.0);
    transition: all .3s;
}
.vt_moduletable_content img:hover {
    transform: scale(1.1);
}

Спасибо Вам огромное. Помогло
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Отключить сессии для front-end - как сделать плагином?

Автор Matysh

Ответов: 0
Просмотров: 17
Последний ответ Сегодня в 14:14:01
от Matysh
В VM3 в корзине сделать таблицу доставки?

Автор Усач911

Ответов: 0
Просмотров: 30
Последний ответ 06.12.2017, 15:02:53
от Усач911
Подключение готового сайта к Joomla, как сделать?

Автор Nadya_Sova

Ответов: 23
Просмотров: 405
Последний ответ 27.11.2017, 13:24:45
от Septdir
Посоветуйте, пожалуйста, как сделать подобный фильтр

Автор dron

Ответов: 5
Просмотров: 116
Последний ответ 21.11.2017, 22:20:01
от dron
Сделать меню горизонтальным

Автор tmpnikl

Ответов: 10
Просмотров: 177
Последний ответ 10.11.2017, 08:02:14
от tmpnikl