Разработка с помощью jsFiddle.net

Гулял я по интернету, искал плагины для mootools, и в официальном Forge в качестве демо к одному из плагинов была ссылка на инструмент – jsFiddle.net. Недолго просидев за этим очень полезным инструментом я пришел к выводу, что надо написать обзор данного сайта и донести его до масс.

jsFiddle.net – это инновационный инструмент, работающий со следующими языками: HTML, CSS и JavaScript прямо в браузере. Создал этот инструмент Piotr Zalewa и продумал интерфейс Oskar Krawczyk. Самое главное отличие в Fiddle, что он позволяет видеть результат не перезагружая страницу, а просто взглянуть на окно с заголовком Result.

Читать дальше

Нокогири: парсинг HTML в одну строку

Мучительный опыт парсинга кучи невалидных html и «xml» документов и удивительная простота dapper (сервис) и nokogiri (ruby) заставили потратить 5 часов на написание своей собственной пилы.

Примеры использования:

<?php
$html = gzdecode(file_get_contents('http://habrahabr.ru/'));

$saw = new nokogiri($html);
var_dump($saw->get('a.habracut')->toArray());
// На выходе: Array(6) { [0]=> array(3) { ["class"]=> string(8) "habracut" ["href"]=> string(56) "http://habrahabr.ru/blogs/google_chrome/110099/#habracut" ["#text"]=> string(29) "Читать дальше →" } [1]=> ....
var_dump($saw->get('ul.panel-nav-top li.current')->toArray());
// На выходе: array(2) { ["class"]=> string(7) "current" ["a"]=> array(3) { ["href"]=> string(20) "http://habrahabr.ru/" ["class"]=> string(8) "disabled" ["#text"]=> string(10) "Посты" } }
var_dump($saw->get('#sidebar dl.air-comment a.topic')->toArray());
// На выходе: array(50) { [0]=> array(3) { ["class"]=> string(5) "topic" ["href"]=> string(36) "http://habrahabr.ru/blogs/os/110045/" ["#text"]=> string(63) "ФБР внедряло backdoor'ы в IPSec код OpenBSD (?)" } [1]=> array(3) { ["cl
var_dump($saw->get('a[rel=bookmark]')->toArray());
// На выходе: array(10) { [0]=> array(4) { ["rel"]=> string(8) "bookmark" ["href"]=> string(47) "http://habrahabr.ru/blogs/google_chrome/110099/" ["class"]=> string(5) "topic" ["#text"]=> string(100) "Google объявил Chrome готовым к использованию в бизнес-среде" } [1]=> array(4) { ["rel"]=

Ошибки html игнорируются.
Распознаются вложеные теги (через пробел), а также конструкции вида .class, #id и [attr=value]
Создание из строки: nokogiri::fromString($htmlString); или new nokogiri($htmlString);
Создание из DomDocument: nokogiri::fromDom($dom);



Читать дальше

Верстка резинового текстового поля (input[type=text])

Думаю, что многим верстальщикам (и не только) приходилось верстать текстовые поля (/>), задавая им произвольные размеры. Но как сделать данный элемент резиновым и удовлетворить следующим условиям:

  1. Возможность установки любых горизонтальных и вертикальных отступов у текста;
  2. Элемент должен занимать весь контейнер, в который он помещен;
  3. Клик мышью в любое место текстового поля устанавливает в нем курсор.

Ответ достаточно прост и решается следующим методом:



Читать дальше
  • 0
  • 18 ноября 2010, 03:46
  • Diesel