[JavaScript] эффект прокурутки каринок при наведении мышки

1 234
S
На сайте с 27.02.2007
Offline
60
#21
Brand from Amber:
Supervisork, есть там некоторые глюки + непонятно зачем аякс приплели, но 8 Кб всяко лучше чем 56 Кб.

А чё за глюки? Я в 3-х браузерах смотрел (О, ФФ, ИЕ) - все нормально. Аякс прицеплен, потому что скрипт 1, а разделов галереи много. Не делать же пол сотни скриптов со своими массивами на каждый раздел? :)

Кроме того, новые разделы галереи создаются не мной. И люди сами скрипты под них не напишут. Можно, конечно генерить скрипт, вставляя в него нужный массив... Но зачем грузить новый скрипт с каждвм разделом, если скрипт может быть один, а набор данных везде свой?

Думаю, ты просто не обратил внимание на эти тонкости. К примеру, здесь все работы из "галереи", а здесь только кухня-столовая... Но есть еще вот это и другие... Так что, думаю, привязка аякса вполне оправдана. Переходя из раздела в раздел, человек грузит новую страницу, размером 4-5 килобайт. Остальное берется из кеша. Потом аяксом подгружаются даныне. Думаю, общую схему лучше не придумать. Если есть возражения, любопытно было бы узнать.

Но это конкретно об аяксе. А меня больше интересовало пролистывание и открытие рисунков. И вроде хочется туда прокрутку мышью вставить... но там так тесно... Что прокрутка мне кажется неуместной.

Supervisork добавил 31.12.2009 в 19:13

ewg777:
Как и Вы они не знают JS, + они используют jQuery

Если б я не знал яваскрипт, как бы я на нем писал? :)

Я говорю о том, что не считаю себя большим мастером яваскрипта. У меня бывают годовые перерывы, когда ничего нового яваскриптить не приходится, достаточно использовать разработанное ранее. Как тут наберешся мастерства? Тут, наоборот, начинаешь забывать, терять квалификацию.

Что они юзают жкуери, я увидел, посмотрев код. Но там так много кода, что я решил не париться, а спросить, какая функция ловит мышь (как раз тема обсуждалась, если б не эта тема, наверное ковырялся бы в коде сам). А то, что в Яндексе (или кто там им сайт делает - студия какая-нить) нет спецов по яваскрипту... :) Эт ты напрасно. Думаю, они могут себе позволить заплатить любому спецу. Так что, даже если у них нет штатного, когда функционал приделать нужно, у них есть тот, кто знает.

Создание сайтов, документация... (http://site3k.net/), сайт нашей дизайн-студии (http://website-it.ru/)
[Удален]
#22

Supervisork, отвечу после НГ! с праздничком вас!

байты ничто - водка все, чмоке =)

S
На сайте с 27.02.2007
Offline
60
#23

Тебя так же. Ваще, всех с праздником!

[Удален]
#24
Supervisork:
bearman, я не большой спец в жабаскрипте и, раз уж зашел разговор о том, писать под жкуери или нет, хотелось бы узнать твое мнение о такой галерее, без жкуери. Фишка в том, что
1) количество отображаемых миниатюр определяется шириной окна
2) общее количество миниатюр порядка 200, но загружаются только те, которые в данный момент отображены

поехали, попишем гадости чуток.

bearman добавил 01.01.2010 в 11:24

if (a == 'prev') {
if (g == 1) {
return req
} else {
a = g - 1
}
} else if (a == 'next') {
if (g == gs) {
return req
} else {
a = g + 1
}

ненавижу такое в коде, где точки с запятой? или это packer съел :)

bearman добавил 01.01.2010 в 11:41

gt - gallery text? gavno tvoe? :D

Непонятные имена переменных, тем более глобальные (могут перекрыть чужие скрипты) это имхо плохо.


if (g == 1) {
document.getElementById("prev").src = '/include/prev2.gif'
} else {
document.getElementById("prev").src = '/include/prev.gif'
}

Не позволит без правки кода вставить 10 галерей на одну страницу.

function galery(a) {
req = false;

По сути все переменные глобальные а это и правда плохо, ибо вот этот, какбы ты не говорил, но это стандартная обертка

try {
req = new ActiveXObject('Msxml2.XMLHTTP')
} catch (e) {
try {
req = new ActiveXObject('Microsoft.XMLHTTP')
} catch (e) {
if (window.XMLHttpRequest) {
req = new XMLHttpRequest()
}
}
}

Она используется в сотнях кусков кода с аяксом.

if (document.location.search) {
param = '/include/ajax.php' + document.location.search + '&cat='
+ cat
} else {
param = '/include/ajax.php' + '?cat=' + cat
}

Зашитые урлы яваскрипт бекенда не позволит без правки кода перенести "прикрутить"(ненавижу это слово) к другому сайту/движку

g = a;
if (gt) {
display();
return false
}

Логика понятная только автору (а ему самому понятна ли?). а ведь любой заглянувший мог бы понять ее, если бы переменые были названы своими именами.

gt = gallery text (я бы даже сказал html)

a = temp/x. для одноразовых переменных по некоторым стандартам используют x.

a = a_l.length;
size = document.body.clientWidth;

ЗЫ: раз Вы на Ты, то ТЫ уверен что всегда будет body.clientWidth или window.innerWidth ? я уверен что еще бывает document.documentElement

if (!size) {
size = 1024
}
pad = 480;
prev_next = 64;
imgwidth = 154;

Ой, а размеры то зачем прямо жестко вшил в код...

function display() {
a = a_l.length;

Как некрасиво ... а вдруг я для какой то цели напишу <script>a = false</script>?

бадабум ... и пипипи следующей логике, будет error который искать будешь часов 2*n. а переменную "a" переобозначить проще простого, поверь :)

root = window.addEventListener || window.attachEvent ? window
: document.addEventListener ? document : null;
if (root) {
if (root.addEventListener) {
root.addEventListener("resize", resizer, false)
} else if (root.attachEvent) {
root.attachEvent("onresize", resizer)
}
}

Где стырил, признавайся? :) в жукери подсматрел?)

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

bearman добавил 01.01.2010 в 11:49

В общем итого: стандартный одноразовый скрипт, который будет использован только на этом сайте, либо еще на паре школьных порталов при условии что им потребуется галерея "кинофильмом" в шапке их "нее*ического портала". Врядли ктото возьмется его поддерживать далее, поддерживать нечего. Если захочется сделать нормальные проверки, рассчеты размеров, кроссбраузерность и прочее, то кода станет не 8 кб, а 18 минимум, тем самым этот код будет всего раза в 2-3 меньше чем jquery + какая нить минималистичная галерея на пару кб кода, окторая да, тоже умеет и по AJAX и по JSON, и по JSONP и по дом дереву с определенными условиями выбирать источники картинок и многое другое делать, и весить в десятки раз меньше за счет жукери, код будет читабельнее, логичнее и проще для дальнейшей работы с ним:) я приверженец не 5 строк, а 15 красивых и поддерживаемых.

Ну и скажу еще итого: код не на столько гавно, чтобы его можно было назвать великий говнкод :) просто он как и все куски кода не на jQuery реализует одну задачу как может и это его прямое предназначение, за что ему и твердая 4ка :)

Brand from Amber
На сайте с 18.08.2007
Offline
291
#25
Supervisork:
Аякс прицеплен, потому что скрипт 1, а разделов галереи много. Не делать же пол сотни скриптов со своими массивами на каждый раздел?

Массив можно и и без аякса, в контенте или отдельным src подключать.

Supervisork:
Кроме того, новые разделы галереи создаются не мной. И люди сами скрипты под них не напишут. Можно, конечно генерить скрипт, вставляя в него нужный массив... Но зачем грузить новый скрипт с каждвм разделом, если скрипт может быть один, а набор данных везде свой?

Я и не спорю - метод подгрузки данных через Аякс вполне пригоден.

Supervisork:
Думаю, общую схему лучше не придумать. Если есть возражения, любопытно было бы узнать.

Не возражения, а варианты:

<script src="скрипт">

<script src="данные">

Supervisork:
А чё за глюки? Я в 3-х браузерах смотрел (О, ФФ, ИЕ) - все нормально.

Сворачиваем окно до небольших размеров. Открываем в этом окне фотку. Разворачиваем окно. получаем:

jpg 2.jpg
Лучший способ понять что-то самому - объяснить это другому.
S
На сайте с 27.02.2007
Offline
60
#26
bearman:
ненавижу такое в коде, где точки с запятой? или это packer съел

Изначально-то я даже табуляции ставлю :) Это пакер кушал

bearman:
Непонятные имена переменных, тем более глобальные (могут перекрыть чужие скрипты) это имхо плохо

непонятные, для сокращения объема (мне-то понятно, что я писал). Изначально-то я думал просто посокращать имена и пробелы для компактности. Только потом пришла идея пропустить через пакер. А чужие скрипты не перекроют - там чужего нет :)

bearman:
Не позволит без правки кода вставить 10 галерей на одну страницу... Зашитые урлы яваскрипт бекенда не позволит без правки кода перенести "прикрутить"(ненавижу это слово) к другому сайту/движку

Ты мыслишь слишком универсально. Тут не будет несколько галерей на странице. И скрипт не нужно прикручивать к другим движкам. Менее универсальный код получается более компактным. Исходи из того, что это заточено под конкретную задачу, а не библиотека стандартных процедур на все случаи жизни :)

bearman:
Она используется в сотнях кусков кода с аяксом.

Многие конструкции где-то еще используются. Это агрумент за что, или прочив чего?

for(i=0;i<a;i++) - думаю, найдется в миллионе скриптов, разве это отменяет все авторские права на скрипт ;)

bearman:
Логика понятная только автору (а ему самому понятна ли?). а ведь любой заглянувший мог бы понять ее, если бы переменые были названы своими именами

Когда я писал переменные имели нормальные имена. Потом сократил. Я ж писал скрипт не для обсуждения. Компактность имела значение. Так что, прости за нечитабельный код.

Сам фрагмент проверяет, готов ли галериТекст. Если по каким-то причинам не готов - не пытаться его отобразить (это я по-памяти отвечаю, не заглядывая в код).

bearman:
ЗЫ: раз Вы на Ты, то ТЫ уверен что всегда будет body.clientWidth или window.innerWidth ? я уверен что еще бывает document.documentElement

У меня принцип - будь проще. Мне нравится обращение на "ты". Я уверен, что всегда будет body.clientWidth. Я проверял в Опере, Мазиле и Эксплорере. Если смотрел скрипт resirer.js, который писался в 2005 (или 2004) году для другого сайта, но очень кстати пришелся здесь, то там идет проверка. А тут, для краткости, я не стал этого делать, так как видел, что все работает. Возможно это имело бы значение для Сафари... Но поскольку ее у меня нет, все равно не проверю...

bearman:
Ой, а размеры то зачем прямо жестко вшил в код...

Дык, скрипт НЕ универсальный, заточенный под задачу :) Я ж не утверждал, что создал универсальную замену jquery :)

bearman:
Как некрасиво ... а вдруг я для какой то цели напишу <script>a = false</script>?
бадабум ... и пипипи следующей логике, будет error который искать будешь часов 2*n. а переменную "a" переобозначить проще простого, поверь

А я тебя туда не пущу ;) Там же никто кроме меня не рулит скриптами. А я помню что и где делал. Аргументы по поводу уникальности переменных понятны. В следующий раз, наверное, буду следить за этим для упрощения расширяемости и переносимости.

bearman:
Где стырил, признавайся? в жукери подсматрел?)

Дык это ж, опять же, стандартная фича. Я ее с 2006 точно юзаю. Жкуери тогда еще, наверное, не существовало.

bearman:
твердая 4ка

Обижаешь начальник. Для данной задачи лучше и не сделать :) ИМХО.

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

Brand from Amber:
Массив можно и и без аякса, в контенте или отдельным src подключать.
Я и не спорю - метод подгрузки данных через Аякс вполне пригоден.
Не возражения, а варианты:
<script src="скрипт">
<script src="данные">

Как вариант - да. Но использование аякса исключает вероятность попытки отобразить галерею раньше, чем загрузятся ее данные. Хотя, и в этих вариантах это можно было предусмотреть...

Brand from Amber:
Сворачиваем окно до небольших размеров. Открываем в этом окне фотку. Разворачиваем окно. получаем:

Спасибо. Не обратил внимание. Поработаю над функцией getPageSizeWithScroll.

Supervisork добавил 01.01.2010 в 17:30

подрихтовал getPageSizeWithScroll

[Удален]
#27
Supervisork:
Изначально-то я даже табуляции ставлю Это пакер кушал

тут ты крут, релаьно 5+ :)

ну я и подумал что пакер покушал, слишком красиво, человек так аккуратно кропотливо врядли будет делать :)

Supervisork:
непонятные, для сокращения объема (мне-то понятно, что я писал). Изначально-то я думал просто посокращать имена и пробелы для компактности. Только потом пришла идея пропустить через пакер. А чужие скрипты не перекроют - там чужего нет

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

Supervisork:
Ты мыслишь слишком универсально. Тут не будет несколько галерей на странице. И скрипт не нужно прикручивать к другим движкам. Менее универсальный код получается более компактным. Исходи из того, что это заточено под конкретную задачу, а не библиотека стандартных процедур на все случаи жизни

прости, оценивать одноразовую работу просто не привык, не думал что это имеет смысл.

Supervisork:
Многие конструкции где-то еще используются. Это агрумент за что, или прочив чего?
for(i=0;i<a;i++) - думаю, найдется в миллионе скриптов, разве это отменяет все авторские права на скрипт

я не про авторские права, а про ошибки и их кетчинг, а не if'ы с проверкой условий на браузеры. просто к слову сказал

Supervisork:
Когда я писал переменные имели нормальные имена. Потом сократил. Я ж писал скрипт не для обсуждения. Компактность имела значение. Так что, прости за нечитабельный код.
Сам фрагмент проверяет, готов ли галериТекст. Если по каким-то причинам не готов - не пытаться его отобразить (это я по-памяти отвечаю, не заглядывая в код).

нечего сказать.

Supervisork:
У меня принцип - будь проще. Мне нравится обращение на "ты". Я уверен, что всегда будет body.clientWidth. Я проверял в Опере, Мазиле и Эксплорере. Если смотрел скрипт resirer.js, который писался в 2005 (или 2004) году для другого сайта, но очень кстати пришелся здесь, то там идет проверка. А тут, для краткости, я не стал этого делать, так как видел, что все работает. Возможно это имело бы значение для Сафари... Но поскольку ее у меня нет, все равно не проверю...

это бы могло иметь смысл для некоторых doctype ;) вот тут можно хватануть горя при отладке.

Supervisork:
Дык, скрипт НЕ универсальный, заточенный под задачу Я ж не утверждал, что создал универсальную замену jquery

я и не обсуждал универсальность жукери :)

Supervisork:
А я тебя туда не пущу Там же никто кроме меня не рулит скриптами. А я помню что и где делал. Аргументы по поводу уникальности переменных понятны. В следующий раз, наверное, буду следить за этим для упрощения расширяемости и переносимости.

тут не следить надо, а сокращать область видимости.

Supervisork:
Обижаешь начальник. Для данной задачи лучше и не сделать ИМХО.
Твоя критика была полезна. Но общее впечатление не достаточно четко выражено. Не придавая большого внимания коду, как сама галерея в целом? Какое впечатление? В том числе, как альтернатива подобным на jquery?

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

альтернативу жукери? не смеши =)) реально не смеши, посмотри какие там решения существуют.

Supervisork:
Как вариант - да. Но использование аякса исключает вероятность попытки отобразить галерею раньше, чем загрузятся ее данные. Хотя, и в этих вариантах это можно было предусмотреть...

onready все решает 100%. костыли тут не сильно нужны

S
На сайте с 27.02.2007
Offline
60
#28
bearman:
я бы добавил преждевременную подгрузку картинок, перед их показом в галерее самой. чтобы не показывать человеку квадраты заполняющиеся сверху вниз

Когда я последний раз заглядывал в данные, тут была очередь порядка 190 изображений. Если человек не хочет смотреть все (оно же утомительно), зачем по-напрасну гонять трафик? Или имеешь в виду, подгружать только следующий экран (следующую "страницу")?

bearman:
альтернативу жукери? не смеши =)) реально не смеши, посмотри какие там решения существуют.

То есть, с твоей точки зрения, какашка вышла? :( А что тут тебе так не понравилось?

[Удален]
#29
Supervisork:
Когда я последний раз заглядывал в данные, тут была очередь порядка 190 изображений. Если человек не хочет смотреть все (оно же утомительно), зачем по-напрасну гонять трафик? Или имеешь в виду, подгружать только следующий экран (следующую "страницу")?

можно и эти, только до времени их загрузки показать там индикатор загрузки

Supervisork:
То есть, с твоей точки зрения, какашка вышла? А что тут тебе так не понравилось?

все понравилось. с задачей справился скрипт :) ты просто спрашивал "чем твой хуже", вот я и ответил что они рядом не стоят даже :)

S
На сайте с 27.02.2007
Offline
60
#30
bearman:
я не про авторские права, а про ошибки и их кетчинг, а не if'ы с проверкой условий на браузеры. просто к слову сказал

Ну, тут просто глупо анализировать браузер. Здесь сам бог велел анализировать метод поддержки. А как обзовут браузер, скрипту по-барабану. У меня ж стаж яваскрипта уже седьмой год начался. В 2004 (если не в 2003) создавал на нем раскрывающиеся древовидные меню и меню из выпадающих списков. Сейчас они стали популярны. Тогда это было чем-то из ряда вон выходящим. Так что, некоторый опыт яваскрипта есть. Однако мастерства большого нет, так как случаются большие перерывы. По-этому, где-то могут быть "не изящные" решения. В первой, черновой версии скрипта они всегда есть. Когда пищу, конец предлставляю в общих чертах. По мере написания иногда возникает понимание, что вначале нужно было не так... А после написания все осмысливаю заново и, часто, переписываю еще раз, чтобы получить отшлифованный бриллиант. Но мастерства маловато, так что, ляпусы могут остаться незамеченными.

Так что, если видишь изящный ход, не удивляйся - это опыт. Если видишь ляпус, имей в виду: долгие перерывы в практике не могут не сказываться. Да и "новые веяния" могут по-долгу оставаться мной незамечены. Так как яваскрипт мне нужен только от случая к случаю, я не "держу руку на его пульсе".

Надеюсь, это поясняет особенности стиля в моем яваскрипт-коде :)

1 234

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий