Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 66
Точно пригодится, спасибо вам.
Вооот, это уже ближе к правильному Хабру. А то филдсеты, запоминалки на сайтах. Это хоть почитать полезно )
Спасибо… как раз на днях нужно будет решить такую задачку, теперь не придется искать решение ))
То что нужно! Спасибо.
вы что, обалдели? это код для чужого сайта (ключевое слово ЧУЖОГО). Я поклонник jQuery, но это бездумно, для какого-то кусочка js пользователю навязывать целый framework. А почему прототайп не прикрутили с его 130kb кода?
Нужно бороть свою лень и вспоминать чистый js для таких целей.
Нужно бороть свою лень и вспоминать чистый js для таких целей.
Хотел бы я посмотреть как у вас получится воспроизвести этот эффект на голом js. Он у вас будет весить как сам jquery. К тому же jquery подгружается только если он у вас на сайте не используется. К тому же у вас есть выбор использовать простую кнопку или кнопку с эффектом.
товарищ, опомнись! да за такое руки отрывать нужно…
Он у вас будет весить как сам jquery.
чушь! или правда, так считаешь? если да, то тебе точно пора завязывать с клиентскими скриптами.
Он у вас будет весить как сам jquery.
чушь! или правда, так считаешь? если да, то тебе точно пора завязывать с клиентскими скриптами.
Руки надо отрывать за пустословие. Напиши альтернативу на чистом js и выложи тут. Тогда поговорим. И чтобы без багов и красиво.
Всё как всегда. Представьте, что вместо дискуссии/обсуждения/критики нужно было бы обязательно отвечать скриптом на скрипт, либой на либу, кодом на код… И куда бы мы приехали?
— Извините, но Ваше кино убогое, товарищ режиссёр.
— А ты попробуй-ка сними лучше. Тогда и поговорим.
— Извините, но Ваше кино убогое, товарищ режиссёр.
— А ты попробуй-ка сними лучше. Тогда и поговорим.
смотрим внимательно — pk69.com/temp/pure_modal.html
4 килибайта кода, которые умеют показать оверлей и модальное окошко. причём обращаем внимание, что анимация идёт последовательно, те появляется оверлей, потом плашка и наоборот.
мне кажется, самое время кое-кому выпить яду :)
4 килибайта кода, которые умеют показать оверлей и модальное окошко. причём обращаем внимание, что анимация идёт последовательно, те появляется оверлей, потом плашка и наоборот.
мне кажется, самое время кое-кому выпить яду :)
Это убожество, как сам автор правильно выразился «херовина пыщь пыщь» :D.
Весь скрипт выводит 2 дива, без всякого намёка на скругления, центрировании при скролле, какой-нибудь элементарной тени, элементарного дизайна типа кнопочки для закрытия окна. А если страница будет по длиннее? При клике где-то за пределами экрана будет появляться окошечко с жёстко заданным контентом, а юзер будет жёстко материться.
Если прикинуть доработки до уровня того же fancybox, то как раз выйдет сравнимый размерами с jquery (4кб помножить на 10 = 40 кБ) глючный скриптик.
Ой, кстати не кроссбраузерно (в ie потести для разнообразия).
Вообще я чувствую, что диалог идёт с человеком который в жизни своей ничего серьёзного не писал, особенно на javascript, особенно на голом javascript.
Мне кажется самое время тебе выпить яду debiql?
Весь скрипт выводит 2 дива, без всякого намёка на скругления, центрировании при скролле, какой-нибудь элементарной тени, элементарного дизайна типа кнопочки для закрытия окна. А если страница будет по длиннее? При клике где-то за пределами экрана будет появляться окошечко с жёстко заданным контентом, а юзер будет жёстко материться.
Если прикинуть доработки до уровня того же fancybox, то как раз выйдет сравнимый размерами с jquery (4кб помножить на 10 = 40 кБ) глючный скриптик.
Ой, кстати не кроссбраузерно (в ie потести для разнообразия).
Вообще я чувствую, что диалог идёт с человеком который в жизни своей ничего серьёзного не писал, особенно на javascript, особенно на голом javascript.
Мне кажется самое время тебе выпить яду debiql?
ты знаешь, я почему-то был уверен, что именно так ты мне и ответишь. те начнёшь тупо наезжать на то, что мой простенький скрипт не умеет всей той ненужной в данном случае тийни. давай не будем тыкать пальцами в очевидные «недостатки», которые таковыми не являются. те ты меня упрекаешь в том, что я не захотел тратить время на бесполезную для нашего спора ху*ту? добавить реакцию на скрол? сделать адекватное закрытие? показать ифрейм? иди пей яд, мне за это не платят :)
да, и поясни убогому, как скруглённые края, тении прочее какое это отношение имеет к javascrit вообще?
подытожу. я ввязался в спор, пытаясь тебе показать, что не обязательно палить по мухам из пушки, когда есть мухобойка. я потратил время на создание простого примера. и чё в ответ? :)
да, и поясни убогому, как скруглённые края, тении прочее какое это отношение имеет к javascrit вообще?
подытожу. я ввязался в спор, пытаясь тебе показать, что не обязательно палить по мухам из пушки, когда есть мухобойка. я потратил время на создание простого примера. и чё в ответ? :)
jQuery получил такое распространение как раз за счёт того, что ты называешь «бесполезной хуятой». Так что ты ничего не доказал.
Правильное решение использовать на своем сайте для подобных целей проверенный временем фреймворк, с возможностью расширения функционала, нежели убогий скрипт местного розлива, равный по размеру со всем jQuery.
Правильное решение использовать на своем сайте для подобных целей проверенный временем фреймворк, с возможностью расширения функционала, нежели убогий скрипт местного розлива, равный по размеру со всем jQuery.
Поздравляю, в этом комментарии во по максимуму показали свою некомпетентность.
Решение qbique великолепно! Что главное, оно не тормозит, в отличие от $%#@ окошечек, грузящих море всего и полчаса мучающих мои глаза жалкими попытками извергнуть «красивую» «анимацию». И вот не надо про мои браузер и компьютер — сайты для пользователя, не наоборот; такие тормоза далеко не только у меня.
Реакция на скролл ~3 строки, ИЕ ~20 строк, оформление — вообще не в кассу, к тому же делается оно небольшим добавлением разметки и несколькими строками css/js на выбор.
// Бармен, двойной йад товарищу, пожалуйста.
Решение qbique великолепно! Что главное, оно не тормозит, в отличие от $%#@ окошечек, грузящих море всего и полчаса мучающих мои глаза жалкими попытками извергнуть «красивую» «анимацию». И вот не надо про мои браузер и компьютер — сайты для пользователя, не наоборот; такие тормоза далеко не только у меня.
Реакция на скролл ~3 строки, ИЕ ~20 строк, оформление — вообще не в кассу, к тому же делается оно небольшим добавлением разметки и несколькими строками css/js на выбор.
// Бармен, двойной йад товарищу, пожалуйста.
Да сейчас уже многие и не знают чистый JS. Была даже фраза, что jquery сделан людьми незнающими javascript для людей незнающих javascript. Не уверен насчет первой части фразы, но вот со второй полностью согласен! Сейчас фреймворки используют для каждой мелочи — вывести алерт или скрыть/показать блок (сам видел).
fancybox — это 600 строк кода js (14 кБ не сжатый, 8 кБ сжатый). И это только плагин. Говорить что всё это ради кусочка js неправильно. Голым js повторить будет, согласитесь, трудновато.
Вам же не нужно обрабатывать все возможные параметры, которые воспринимает fancybox. Вам надо всего-то затемнить фон и нарисовать окошко, на чистом js в 600 строк можно уложиться. Без jquery.
Ооочень сильно сомневаюсь, что вы уложитесь в 600 строк, за короткий срок, да ещё и без багов. А если понадобиться, что то усовершенствовать, добавить новую фишечку? Писать каждый раз новый скрипт, место того чтобы подключить новый плагин за 5 минут?
Данный подход будет на голову выше любого вашего самопала.
Данный подход будет на голову выше любого вашего самопала.
:) jQuery и fancybox тоже не боги писали. А называть код, который вы даже не видели, самопалом, это как-то слишком опрометчиво.
У меня сложилось впечатление, что вами движет нежелание углубляться в кодинг. От использования фреймворка, вы, конечно же, выиграли выиграли. Проигравшие в этом случае — ваши пользователи.
У меня сложилось впечатление, что вами движет нежелание углубляться в кодинг. От использования фреймворка, вы, конечно же, выиграли выиграли. Проигравшие в этом случае — ваши пользователи.
jQuery уже 3 года развивается и исправляется. Ваш код будет полюбому моложе и глючнее.
По опыту знаю, что писать на чистом js неблагодарное дело, потому как много браузеров со своим особым мнением. Вам как минимум придётся писать скрипт два раза, для IE и не для IE.
В чём проигрыш? Пользователь получает крутую фишечку для своего блога, а вы честь и почёт за предоставленную возможность на своем ресурсе. В выигрыше все.
По опыту знаю, что писать на чистом js неблагодарное дело, потому как много браузеров со своим особым мнением. Вам как минимум придётся писать скрипт два раза, для IE и не для IE.
В чём проигрыш? Пользователь получает крутую фишечку для своего блога, а вы честь и почёт за предоставленную возможность на своем ресурсе. В выигрыше все.
комрад, просто признай (хотя бы самому себе), что ты понятия не имеешь о том, что такое js ;)
и хватит прикрываться, мол там всё отлажено и бла бла бла. что тебе мешает вытащить некоторые методы jq, которые являются наиболее рисковынными в плане ошибок и крос-браузерности? я выдал пример выше, 137 строк умеют показать оверлей и плашку, с анимацией и всей ботвой. ещё столько же, и скрипт уже умеет делать всё что нужно. и это без тяжёлого фреймворка и ещё плагина и ещё самого скрипта, который загружает эту ненужную херь.
и хватит прикрываться, мол там всё отлажено и бла бла бла. что тебе мешает вытащить некоторые методы jq, которые являются наиболее рисковынными в плане ошибок и крос-браузерности? я выдал пример выше, 137 строк умеют показать оверлей и плашку, с анимацией и всей ботвой. ещё столько же, и скрипт уже умеет делать всё что нужно. и это без тяжёлого фреймворка и ещё плагина и ещё самого скрипта, который загружает эту ненужную херь.
ВЫТАЩИТЬ НЕКОТОРЫЕ МЕТОДЫ JQ ?:D :D :D
Ты сам понял что ты написал? Ты явно не имеешь представление не о js не о jquery.
Твой пример выше убожество, я написал выше.
я то понял, а ты? нет? жаль, очень жаль… сразу видно профи!
ты давай, жёстче меня жёстче, когда аргументы заканчиваются, начинается переход на личности :) ты ведь уже слил на самом деле. что скажешь? :)
ты давай, жёстче меня жёстче, когда аргументы заканчиваются, начинается переход на личности :) ты ведь уже слил на самом деле. что скажешь? :)
мне нравятся твои ответы, я позволю себе продлжить беседу и прокоментирую некоторые моменты :)
когда я написал «вытащить некоторые методы jq», я как бы намекнул, что если tcnm сомнения в своих силах, то можно позаимствовать некоторые функции у готового фреймворка. например, если ты посмотришь мой код, там есть немного мутулзов (ф-ии getHeight и setOpacity). я взял функции для опеределения высоты окна, чтобы не париться над кросс браузерностью.
хотя, ты знаешь, я понимаю в чём проблема. ты на самом деле понял, что я имел ввиду. просто лезть в код jquery тебе страшно, ведь не поймёшь нифига :) убожество — это наше всё!
когда я написал «вытащить некоторые методы jq», я как бы намекнул, что если tcnm сомнения в своих силах, то можно позаимствовать некоторые функции у готового фреймворка. например, если ты посмотришь мой код, там есть немного мутулзов (ф-ии getHeight и setOpacity). я взял функции для опеределения высоты окна, чтобы не париться над кросс браузерностью.
хотя, ты знаешь, я понимаю в чём проблема. ты на самом деле понял, что я имел ввиду. просто лезть в код jquery тебе страшно, ведь не поймёшь нифига :) убожество — это наше всё!
Насчёт «вытащить некоторые методы jq» — это всё-таки почти нереально. В jQuery очень большая связность, т.е. при вытаскивании почти любого куска минимум половину придётся переписывать без зависимостей. В этом плане mootools очень хороши.
Я, правда, давно уже фреймворки не расковыривал… Занятие очень для развития полезное (тонкий намёк не вам ;) )
Я, правда, давно уже фреймворки не расковыривал… Занятие очень для развития полезное (тонкий намёк не вам ;) )
Вообще-то эту фразу говорили про прототайп
вторая часть фразы сегодня, имхо, верна касательно почти любого языка в вебе. так надоело разбирать жуткую верстку, надоело объяснять людям, что вместо «вот такого вот эффекта» проще самому написать…
Все зависит от наличия времени (планов, сроков) и денег.
Если того или другого много, то пишем свой скрипт: занимает мало, работает быстро, стоит дорого (в худшем для «казны» случае: проектирование, разработка, документация, тесты).
Если мало, то включается режим «дешево и сердито». Если подходить к этому принципу с умом и обернуть все качественным интерфейсом, а потом, когда появятся деньги или время, переписать реализацию интерфейса, то я только за!
Да и вес библиотеки это не такой уж и весомый аргумент.
P.S. Это не агитация к использованию framework’ов, а рациональный подход.
Если того или другого много, то пишем свой скрипт: занимает мало, работает быстро, стоит дорого (в худшем для «казны» случае: проектирование, разработка, документация, тесты).
Если мало, то включается режим «дешево и сердито». Если подходить к этому принципу с умом и обернуть все качественным интерфейсом, а потом, когда появятся деньги или время, переписать реализацию интерфейса, то я только за!
Да и вес библиотеки это не такой уж и весомый аргумент.
P.S. Это не агитация к использованию framework’ов, а рациональный подход.
Решение красивое, но бэклинк потеряете. Если продвижение ресурса не важно — то вполне пойдет.
В голове промелькнула мысль. А почему бы ребятам из Mozilla, Opera и т.п. не начать включать популярные JS-Framework'и прямо в браузеры? Просто глупо загружать одно и то же на каждом сайте.
Думается по тому, что они обновляются :-) К тому же некоторые извращенцы могут вносить коррективы непосредственно в фреймворк (было дело исправлял пару багов в MooTools). Да к тому же у Google была такая инициатива, для экономии траффика пользователей и т.д. Но как-то заглохло это
Можно просто использовать ссылки с гугл-кода, тогда на всех сайтах пользователь будет единожды загружать скрипт, он будет в кешах.
мне больше нравится идея от Google.
var use = function(scriptName, onReadyFunction)
{
…
};
и потом просто
use('http://mysite/jquery.js', function()
{
/./ code after use.
});
var use = function(scriptName, onReadyFunction)
{
…
};
и потом просто
use('http://mysite/jquery.js', function()
{
/./ code after use.
});
Интересная мысль.
А что внутри var use = function(scriptName, onReadyFunction)?
Можно страницу с использованием этого метода?
А что внутри var use = function(scriptName, onReadyFunction)?
Можно страницу с использованием этого метода?
Собственно, всё сделано до нас: i-novice.net/google-ajax-api/
Я же использую свою реализацию в виде плагина jQuery, но она требует jQuery.
(function()
{
$.use = function(scriptUrl, callback)
{
$.ajax({
url: scriptUrl,
dataType: 'script',
cache: true,
success: function()
{
if (callback) callback();
}
});
};
})(jQuery);
Я же использую свою реализацию в виде плагина jQuery, но она требует jQuery.
(function()
{
$.use = function(scriptUrl, callback)
{
$.ajax({
url: scriptUrl,
dataType: 'script',
cache: true,
success: function()
{
if (callback) callback();
}
});
};
})(jQuery);
Вопрос автору поста. Вам не кажется что
- надо использовать noConflict mode для jQuery
- вы не заботитесь о версии jQuery, а ведь она может оказаться несовместимой с fancybox
- вы работаете «в агрессивной среде», так что довольно здраво jQuery, Fancybox и всё остальное прятать в какой-нибудь служебный объект, как то _____MySiteStuff
Здравые мысли. Буду благодарен за развитие. Может перерастёт в крупный опенсорс проект ;)
По роду своей деятельности мне приходится писать скрипты которые будут выполнятся в «агрессивной среде». Наступал на грабли и не раз и постепенно прихожу к мысли, что использовать сторонние фреймворки в таких ситуациях дело очень опасное. Самое опасное — это модификация DOM. Вдруг владелец сайта не в том место вставил JS код, неверно определили событие DomLoad, страница слишком тяжёлая — и всё, в IE получаем Operation Aborted exception и пользоветель уходит с сайта. Надо использовать максимально простые решения.
Не задумывались, почему используют document.write()? Ибо это надёжно. Почему Google Analytics ставится перед? Что бы DOM уже был готов. И это при том, что они не пытаются его толком модифицировать.
Я начинаю продумывать концепцию фреймворка для таких задач, когда всё выполняется в сторонней среде, когда требования надёжности не позволяют уронить сайт у которого этот JS. Это должна быть модульная система (по типу YASS). Она должна иметь модуль «общения» со своими серверами.
Всё по отдельности у меня есть, но хочется собрать манёвренный комбайн :-) И не думаю что это станет Open Source, хотя может и будет кому-то полезным
Не задумывались, почему используют document.write()? Ибо это надёжно. Почему Google Analytics ставится перед? Что бы DOM уже был готов. И это при том, что они не пытаются его толком модифицировать.
Я начинаю продумывать концепцию фреймворка для таких задач, когда всё выполняется в сторонней среде, когда требования надёжности не позволяют уронить сайт у которого этот JS. Это должна быть модульная система (по типу YASS). Она должна иметь модуль «общения» со своими серверами.
Всё по отдельности у меня есть, но хочется собрать манёвренный комбайн :-) И не думаю что это станет Open Source, хотя может и будет кому-то полезным
ушастая визитка, гыгы
А id's для логин-полей/labels так и не поправили.
У вас стандартная недоработка: в font-family прописана только Verdana :) Не у всех она есть.
Подгружать 70 Кб ради бесполезной кнопки?
Надеюсь мне не придется пользоваться такими сайтами.
Надеюсь мне не придется пользоваться такими сайтами.
как страшно жить когда встречаются вот такие сайты, да. 70 кб блин!
Флеш баннер справа от этой статьи весит 50 кБ. И пользы, кроме владельцев хабра, явно никому не приносит. Однако же вы пользуетесь этим сайтом.
Баннеры мы режем. Вы не размерами думайте, а адекватностью решения по отношению к задаче.
Задача стояла следующая:
Как использовать возможности jQuery на другом сайте.
Решение задачи в посте.
Решение не адекватно? Я вам ещё раз напоминаю что jquery подгружается только в том случае, если не подключено на сайте. Это наиболее оптимальное решение задачи. Если пользователь знает что у него не используется jquery на сайте и для него критичны лишние 50 килобайтов, то он в праве использовать обычную кнопку.
Как использовать возможности jQuery на другом сайте.
Решение задачи в посте.
Решение не адекватно? Я вам ещё раз напоминаю что jquery подгружается только в том случае, если не подключено на сайте. Это наиболее оптимальное решение задачи. Если пользователь знает что у него не используется jquery на сайте и для него критичны лишние 50 килобайтов, то он в праве использовать обычную кнопку.
В упор не вижу баннера. У вас наверно бесплатный аккаунт ;)
p.s. Я себя некомфортно чевствую когда у меня при верстке шапка весит 70 Кб (бывает иногда огромная, и хрен ведь сожмешь), а уж яваскрипт — тем более. Тем более что автор ведь дже не подумал о кегшировании и выставлении правильных заголовов, вот я уверен!
p.s. Я себя некомфортно чевствую когда у меня при верстке шапка весит 70 Кб (бывает иногда огромная, и хрен ведь сожмешь), а уж яваскрипт — тем более. Тем более что автор ведь дже не подумал о кегшировании и выставлении правильных заголовов, вот я уверен!
А кстати, почему не делать виджет ифреймом? А уже в ифрейме подгружать всю эту бесполезную хрень (причем желательно не сразу, а с таймаутом через несколько секунд после дозагрузки всего контента оснеовной страницы)?
Преимущество в ср-и со скриптом — скрипт блокирует зарузку документа.
Преимущество в ср-и со скриптом — скрипт блокирует зарузку документа.
Всем ужасающимся кощунственности автора этого топика который буквально высасывает у вас последних 70 килобайт ни в коем случае не стоит задумываться о том, что не оптимизированные картинки встречающиеся повсеместно на просторах сети, отнимают гораздо больше трафика чем все фреймворки вместо взятые. Это взорвет их мозг.
вот этот уебан с прозрачностью — moiavizitka.ru/img/dezign/unit.png — наглядный тому пример.
вот этот уебан с прозрачностью — moiavizitka.ru/img/dezign/unit.png — наглядный тому пример.
Вы не знаете, в чем разница между 70 Кб фоновой картинкой и 70 Кб скриптом и их влиянии на скорость загрузки? Почитайте ка матчасть например на webo.in
К тому же эти 70 Кб в большинстве случаев пользователю окажутся не нужны, вряд ли много кто полезет смотреть эту рекламу.
p.s. Ну этой 7 кб картинкой не удивишь, я видел на одном сайте западных фрилансеров иллюстрациии пожатые в пнг (то есть фактически не пожатые) на 100Кб, и их там была далеко не одна!!! Но иллюстрации правда красивые, так что ок.
К тому же эти 70 Кб в большинстве случаев пользователю окажутся не нужны, вряд ли много кто полезет смотреть эту рекламу.
p.s. Ну этой 7 кб картинкой не удивишь, я видел на одном сайте западных фрилансеров иллюстрациии пожатые в пнг (то есть фактически не пожатые) на 100Кб, и их там была далеко не одна!!! Но иллюстрации правда красивые, так что ок.
нужно ещё версию jquery проверять на совместимость с плагином.
Хотелось бы сделать несколько советов на будущее…
1. Указывайте кодировку для JS файлов явно: charset=«UTF-8»
2. Если уж появилась необходимость вставить какой-то код на стороне пользователя, то лучше сделайте это через свою страницу на сайте
Вместо: <script type='text/javascript'>var ExtendVar='ExtendVar';</script>
Лучше: <script type=«text/javascript» charset=«UTF-8» src=«mysite.ru/run.js></script>
Т.о. у вас появится возможность управлять всем исполняемым кодом на стороне юзера.
1. Указывайте кодировку для JS файлов явно: charset=«UTF-8»
2. Если уж появилась необходимость вставить какой-то код на стороне пользователя, то лучше сделайте это через свою страницу на сайте
Вместо: <script type='text/javascript'>var ExtendVar='ExtendVar';</script>
Лучше: <script type=«text/javascript» charset=«UTF-8» src=«mysite.ru/run.js></script>
Т.о. у вас появится возможность управлять всем исполняемым кодом на стороне юзера.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Интеграция вкусностей jQuery в другие сайты