Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.03.2015, 18:13
Аватар для Sanu0074
Аспирант
Отправить личное сообщение для Sanu0074 Посмотреть профиль Найти все сообщения от Sanu0074
 
Регистрация: 16.12.2012
Сообщений: 80

Blur эффект с помощью jQuery
Есть <div>, его ширина 1000x300, внутри него есть <img> - его ширина 150x150
Нужно сделать фон дива в стиле blur заливки, используя цвета присущие дочернему <img>.
Пытался я делать с помощью вот этой штуки, но у меня ничего не вышло, из картинку оно делает размазанную картинку такого-же размера, но размазать по всему диву у меня не получилось, пробовал ее и как dataurl для бэкграунда, но все равно толку ноль. Подскажите как решить данную проблему?
Ответить с цитированием
  #2 (permalink)  
Старый 30.03.2015, 06:02
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Ну так эффект blur не растягивает изображение. Задайте div фоновым изображением дочернее изображение, растянув его на весть родительский элемент, и добавив фильтр.
div { 
    width: 1000px;
    height: 300px;
    background-image: url(name.ext);
    background-size: cover; /* contain or  1000px, 300px */
    filter: blur(4px);
    -o-filter: blur(4px);
    -ms-filter: blur(4px);
    -moz-filter: blur(4px);
    -webkit-filter: blur(4px);
}
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как с помощью JQuery временно отключить интерпретацию html iskman Javascript под браузер 3 20.03.2014 12:24
Настройка текста с помощью JQuery web32 jQuery 6 28.06.2012 11:01
Анимированные кнопки с помощью jQuery a_c jQuery 9 11.04.2011 18:55
jquery выбрать div с помощью ссылки в нем nioxkzn jQuery 2 02.04.2011 00:40
Авторизация в модальном окне с помощью jQuery A.N.R.I jQuery 17 01.03.2010 19:26