Comments 20
Перевод статьи 2012 года…
UFO just landed and posted this here
Статья оригинальная на блоге который уже переводили без разрешения авторов. В целом уже в закладках и так же как и http://tympanus.net/codrops/category/tutorials/ в подписках у всех кто хоть как то верстает или следит за вебом.
На tympanus всегда хорошие статьи. Почему, если уж и переводить, то не взять свежие?
А я зашел почитать, потому что словил себя на том что не писал на джиквери 4 года! И вот на тебе как раз 2012 год :)
Круто конечно, но не знаю как вы, а я бы с удовольствием забыл про всякие веб GL и CSS 3 за возврат разницы в 1-2 гб ОЗУ.
Нет, от CSS3 точно не стоит отказываться. Добиваться одинаковой отрисовки для разных браузеров и устройств только browser-specific селекторами и свойствами — это боль и унижение.
Я думал вы "крутые эффекты" на jQuery уже вымерли.
ничего не хочу сказать, но тут настолько банально, нет какого-то раскрытого тайного знания, чего я всегда жду от хабра(
Может перестать ждать и начать жить?
Здесь, в общем-то, раскрывается тайное знание о том, почему блуждание по вебу скоро будет требовать таких же вложений в клиентскую машину, как и игры.
У меня на Haswell и 18Гб оперативки тормозят почти все примеры с этого сайта.
У меня на Haswell и 18Гб оперативки тормозят почти все примеры с этого сайта.
мак? Уменя даже на телефоне не тормозит
Adding some perspective with CSS3 and jQuery — best viewed in WebKit browsers
Этот срам убрать пора. Во-первых, все браузеры умеют. Во-вторых, Хром единственный не справился с плавным включением тени.
Вопрос только — зачем тут jQuery, да еще и в заголовке
function hoverfold() {
'use strict';
[].slice.call(document.querySelectorAll('.view')).forEach(function (elm) {
var img = elm.getElementsByTagName('img')[0],
src = img.getAttribute('src'),
div = document.createElement('div'),
overlay = document.createElement('span'),
struct = '<div class="slice s1">' +
'<div class="slice s2">' +
'<div class="slice s3">' +
'<div class="slice s4">' +
'<div class="slice s5">' +
'</div>' +
'</div>' +
'</div>' +
'</div>' +
'</div>';
div.innerHTML = struct;
struct = div.firstChild;
overlay.className = 'overlay';
img.parentNode.insertBefore(struct, img);
img.parentNode.removeChild(img);
do {
struct.style.backgroundImage = 'url(' + src + ')';
struct.parentNode.insertBefore(overlay.cloneNode(), struct);
struct = struct.firstChild;
} while (struct);
});
}
Sign up to leave a comment.
Создаем 3D эффекты CSS при наведении с использованием jQuery