jquery
Вращение изображений при помощи Javascript
Ромка — Ср, 03/04/2009 - 14:45
Обновление. Несколько дней назад стала доступна версия 0.7 плагина. В ней немного изменился метод вызова анимации, а также исправлены глюки из-за которых плагин не работал в Internet Explorer.
Баг jQuery в Firefox 3 и WebKit
Ромка — Вс, 10/12/2008 - 13:19
Работая над очередной задачей, столкнулся с проблемой, решить которую помог Гугл. Суть проблемы заключается в том, что в библиотеке jQuery 1.2.6 некорректно работают функции width() и height() в третьем Firefox'е, а также браузерах, работающих на движке WebKit — Safari и Google Chrome. Удивительно, но даже в шестом IE, с которым обычно больше всего проблем, этого глюка нет. Природа проблемы осталась мне неясной, но известно, что она проявляется только тогда, когда в html-коде подключены сначала JS-файлы, а затем CSS-файлы и пропадает если сделать наоборот — сначала подключить все CSS-файлы, а затем все JS-файлы. В новом релизе jQuery этот баг обещают исправить.
Динамическое добавление элементов к форме
Ромка — Ср, 09/17/2008 - 17:02
При разработке модуля Inner poll возникла задача динамического добавления элементов к форме. С помощью библиотеки jQuery эта задача решается в два счета.
Для начала пишем функцию:
<?php
function addInput() {
/* default-id — скрытый элемент формы, из которого берется id для первого создаваемого элемента */
var id = document.getElementById("default-id").value;
id++;
/* в форму с именем testform добавляем новый элемент */
$("form[name=testform]").append('<div id="div-' + id + '"><input name="input-' + id + '" id="input-' + id + '" value="' + id + '"><a href="javascript:{}" onclick="removeInput(\'' + id + '\')">Удалить</a></div>');
/* увеличиваем счетчик элементов */
document.getElementById("default-id").value = id;
}
?>Затем создаем форму:
<?php
<form name="testform" action="test.php" method="POST">
<input type="hidden" id="default-id" value="0">
<input type="submit" value="Отправить!">
</form>
<a href="javascript:{}" onclick="addInput()">Добавить текстовое поле</a><br>
?>Вот и всё. Здесь размещен работающий пример. Кроме добавления элементов, также приведен пример их удаления.
Получение заголовков (HTTP-headers) страницы при помощи Java-script
Ромка — Пнд, 09/15/2008 - 14:48
В журнале Smashing Magazine наткнулся на скрипт (плагин для jQuery), позволяющий автоматически рядом с ссылками указывать размер файла, на который указывает эта ссылка. Оказалось, что этот скрипт в своей работе использует полезный сервис, под названием json-head, который на входе принимает любой URL, а на выходе в формате JSON отдает заголовки, которые получил от сервера.
Анализируя эти заголовки можно на стороне клиента придумать много полезных фишек, кроме указания размера документа, на который ведет ссылка, можно, например, подсвечивать ссылки на недавно обновленные страницы (заголовок "Last-Modified") или нерабочие ссылки (анализ переменной "status_code").
Все те же действия можно проделывать и не используя сторонние сервисы, но в таком случае опрос удаленных серверов и анализ заголовков придется реализовать на стороне своего сервера, со всеми вытекающими отсюда достоинствами (независимость от сторонних сервисов и того, включена на стороне клиента поддержка Java-script или нет) и недостатками (в случае большого количества запросов забанят ip вашего сервера, а не ip сервера http://json-head.appspot.com ну и необходимость разработки собственного решения).
Кстати, с помощью этого сервиса, совершенно случайно выяснил, что Гугл работает с использованием веб-сервера собственной разработки — gws, по данным из Википедии на этом ПО работает 9,3% всех сайтов в интернете, то есть Гугл — это и есть почти 10% интернета!
Автоматическая "газетная" верстка (верстка в несколько колонок)
Ромка — Пт, 09/05/2008 - 14:35
Выглядит это так:
Lorem ipsum ne justo
Bonorum has. His ut cibo quas tantas, vis ut probo adhuc definiebas, has at meis debet vulputate. No sed velit essent suavitate, in pro decore ceteros temporibus, usu in odio offendit theophrastus. Mel labore indoctum cu, ad soleat admodum delicatissimi sed, mei viris tritani ullamcorper eu. Ut vim simul aperiam.
Eu eleifend repudiandae has. Mea eu ridens aliquam. Nisl aeque sit ut, posse dolor utinam cum in. Ad timeam sapientem eos, et eripuit inermis nam. Eos integre voluptaria ne, iriure concludaturque ut eum.
Vis erant intellegat in. Soleat legere no ius, usu ex laoreet molestie. Sit eu sint inermis. Ea zzril scribentur pro.
Tempor essent appetere
Ius mutat commune expetendis in. Nam et quas sensibus reprimique, vix no erat soluta suavitate. At mel eius dictas latine. Corrumpit inciderint reformidans sed no, no usu omnis utinam noluisse.
Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.
Probo debet quaestio an eos, no mel assum iracundia delicatissimi, rebum facete utroque sed ex. Eu melius invidunt repudiandae vix, eu paulo reformidans deterruisset duo, solum voluptaria efficiantur ea mel. Qui summo zzril alienum et. Eu est ferri iuvaret, mazim epicurei sententiae ut cum, modo reque intellegat ex vix. Vim eu tibique accusamus, quot electram at qui.
Ex iisque eleifend periculis has. Sit aeterno virtute partiendo ei, eam nonumy bonorum adolescens ad. Ut nec suas vocent ornatus, cetero legendos constituam mea ea, pri cu delenit iracundia. Mundi decore nec te.
Soleat civibus in pri
In petentium erroribus percipitur per. Takimata accommodare ius ut, eam no postulant urbanitas. Qui ei tantas consectetuer, quis dictas euripidis duo ei. Quaeque democritum concludaturque has ne.
Blandit insolens constituto vix an. Has diam wisi in, eum unum repudiare no. Sit at virtute rationibus, qui vitae explicari cu. Vim ne singulis voluptatum, sed puto accusata salutandi ei. Ad mel civibus adversarium.
Per ne solum vivendo, fabulas dolorem vivendo in pro. Nec duis ignota cotidieque no, an per possit nostrum. Pro detraxit definitionem eu. Vivendo officiis no nam, eu has reque maiestatis percipitur, dolore reprimique accommodare cum ad. No utinam voluptua oportere pri, augue sonet dicant ei sea.
Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.
Перетаскивание строк таблицы. Table drag and drop — плагин для jQuery
Ромка — Пнд, 09/01/2008 - 23:31
Для работы необходимо скачать последнюю версию библиотеки jQuery, последнюю версию плагина Table DnD. Также можно ознакомиться с официальной документацией к плагину.
Свойства "Table drag and drop"
После подключения, плагин добавляет к функционалу jQuery возможность использовать функцию tableDnD(), принимающую следующие параметры :- onDragStyle — CSS-стиль перетаскиваемой строки;
- onDropStyle — стиль строки, после того как ее перетащили;
- onDragClass — по сути то же что и onDragStyle, но вместо стилей указывается класс, содержащий необходимые стили;
- onDrop — функция, выполняемая после того как строчку "бросили";
- onDragStart — функция, выполняемая после того как строчку начали перетаскивать;
- dragHandle — здесь определяется класс ячейки, за которую можно будет перетаскивать строчку. Если параметр не определен, то хватать строку можно будет за любую ячейку;
- scrollAmount — число пикселей, на которое проскроллится страница, в случае если во время перетаскивания курсор дойдет до верхней или нижней границы страницы.
Простой пример работы
| 1 | One | some text |
| 2 | Two | some text |
| 3 | Three | some text |
| 4 | Four | some text |
| 5 | Five | some text |
| 6 | Six | some text |
Странное поведение Java-script в IE. Один и тот же скрипт в Firefox работает, а в IE – нет.
Ромка — Сб, 03/01/2008 - 17:29
Столкнулся со странной проблемой, на решение которой убил пол дня. Один и тот же скрипт в Firefox'e работает корректно, а в IE – нет. Дальше приведено решение проблемы.
AJAX. Обмен данными между клиентом и сервером, закачка на сервер файлов без перезагрузки страницы при помощи библиотеки jQuery.
Ромка — Ср, 09/05/2007 - 15:44
Задача: разработать веб-страницу, позволяющую обмениваться данными и закачивать файлы на сервер без перезагрузки страницы. В статье приведен пример решения задачи с использованием библиотеки jQuery.
Всем привет!
Последние комментарии