Рубрика «javascript» - 569

в 22:10, , рубрики: canvas, div, html5, javascript, метки: , ,

arrows_for_blocksЗдравствуйте!

Недавно появилась необходимость сделать простое иерархическое дерево для web страницы (структура организации). Блоки получились неплохие, но когда пришло время соединить все стрелками, возник вопрос – как? Решение было два: рисовать стрелки в .png или же использовать спецсимволы.

Но хотелось чего-то более быстрого, удобного, современного – т.е. просто указать: стрелка от блока А к блоку Б. Уже к вечеру была написана небольшая библиотека, позволяющая реализовывать задуманное…
Читать полностью »

в 10:29, , рубрики: javascript, jquery, validation, интерфейсы, юзабилити, Юзабилити в IT, метки: , , , ,

Mailcheck.js — проверка емейла на опечатки jQuery плагин Mailcheck (github) — клиентсайд проверка емейла на опечатки по заранее определённму списку (к примеру, наиболее популярных почтовых сервисов).

Демка | сорсы демки (jsfiddle)

По заявлению (en) авторов (Kicksend), сей плагин увеличил кол-во подтверждений емейла при регистрации на 50%.

Читать полностью »

в 22:32, , рубрики: __proto__, javascript, new, prototype, Веб-разработка, метки: , , ,

В этой статье я попытаюсь кратко в примерах объяснить что такое свойства __proto__, prototype и работу оператора new в JavaScript.

Свойство __proto__

Абсолютно любой объект в JavaScript имеет свойство __proto__. Это скрытое системное свойство, и не во всех реализациях языка оно доступно пользователю.
При обращении к любому свойству объекта, оно в первую очередь ищется в самом объекте:

var obj = {ownProperty: 1};
console.log(obj.ownProperty);// 1

Но если его там нет, поиск происходит в другом объекте, свойстве __proto__:

obj.__proto__ = {propertyOfProto: 2};
console.log(obj.propertyOfProto);// 2

Если его нет и там, оно ищется дальше по цепочке:

obj.__proto__.__proto__ = {propertyOfProtosProto: 3};
console.log(obj.propertyOfProtosProto);// 3

Эта цепочка называется цепочкой прототипов (prototype chain).

Prototype, proto и оператор new
Читать полностью »

в 20:04, , рубрики: greasemonkey, javascript, userscript, userscripts, Веб-разработка, метки: , , ,

Здравствуйте, уважаемые читатели. Постов про пользовательские скрипты (userscripts) было на хабре немало, тем не менее, они только показывали, как ими пользоваться. А в работе юзерскриптов достаточно много кроссбраузерных несовместимостей (как и в любой области браузерного js). Естественно, можно установить различные дополнения для разных браузеров, однако, в случае написание скрипта для конечного пользователя, придётся сопровождать его огромным readme по установке компонент для обеспечения нормальной его работы. Что лично меня, да и вас, полагаю, тоже, не очень-то устраивает.

В данной статье речь будет вестись о трёх браузерах: Mozilla Firefox (с установленным GreaseMonkey), Google Chrome, Opera. Целью статьи является «заготовка», которая позволит пользовательскому скрипту работать одинаковым образом во всех перечисленных браузерах. Реализация GM API рассматриваться не будет, т.к. таковых уже сотни. Предполагается, что читатель уже знаком с общими правилами написания юзерскриптов (в случае, если нет, рекомендую сначала прочитать другую статью).
Читать полностью »

в 14:45, , рубрики: canvas, game development, html 5, javascript, mozilla, websockets, метки: , , , ,

BrowserQuest от Mozilla — это дань классическим многопользовательским играм. Вы играете за молодого воина, который ищет приключения на свою пятую точку. Тут не нужно спасать красавицу-принцессу, но это вам с лихвой окупится опасным миром, наполненным сокровищами и корованами. И главное, все это сделано с помощью HTML5 и JavaScript!
BrowserQuest — многопользовательская игра на canvas
Проект с открытым исходным кодом и хостится на GitHub!
Читать полностью »

в 9:24, , рубрики: Extensions, javascript, opera, userjs, браузеры, расширения, метки: , , , , ,

Всевидящее око Очень давно, еще в самом начале знакомства с jQuery, захотелось мне иметь инструмент, показывающий, к каким элементам на странице прицепились события и что это за события вообще. В тот момент мне не удалось найти ничего подобного. Не сказать, чтобы я очень сильно искал, но ни FireBug ни позже появившийся Dragonfly подобного функционала не имели.

Периодически я вспоминал об этой идее, но беглый взгляд в гугл не давал ничего интересного. До недавнего времени.

Когда в январе мне снова захотелось посмотреть, а не появилось ли чего интересного на эту тему, я нашел прекрасный букмарклет Visual Event 2, написанный Allan Jardine. Букмарклет работал как часы, но нашлась и пара ложек дегтя, маленьких, но неприятных.

Я использую Оперу и все букмарклеты на панели инструментов имеют одинаковую иконку: Иконка букмарклета. Стоит добавить пару-тройку таких закладок и ориентироваться среди них становиться весьма некомфортно. Второй неприятный момент — букмарклет грузил весь свой код с сайта разработчика, что приводило пусть к небольшим, но задержкам.

Поэтому было решено оформить букмарклет в виде расширения для браузера Opera. К тому же я давно хотел познакомиться с Opera Extension API. Вот ссылка на страницу расширения для самых нетерпеливых. Остальных же прошу под кат, где описаны все этапы конвертации букмарклета в расширение для Оперы, проблемы, с которыми я столкнулся и методы их решения.
Читать полностью »

в 8:01, , рубрики: game development, javascript, Tron, игра, метки: , ,

В мире IT в последнее время наметилась тенденция к стремлению максимально уменьшить количество исходного кода, не теряя при этом функциональность. Так вот некий товарищ Alokmenghrajani со своими друзьями задался целью написать игру с минимальным количеством кода. Задумка была написать игру по фильму Tron, и в итоге у них получилось 219 байт, что весьма неплохо.
image
Читать полностью »

в 20:58, , рубрики: coffeescript, javascript, Веб-разработка, руководство, метки: , ,

CoffeeScript: Подробное руководство по циклам

Как известно, CoffeeScript предлагает несколько иной набор управляющих конструкциях, нежели JavaScript.

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

Читать полностью »

в 18:44, , рубрики: javascript, Веб-разработка, ооп, метки: ,

Несмотря на то, что в JavaScript нет встроенной работы с классами или пространствами имен, для JavaScript есть разные библиотекеи, восполняющие эти проблелы, позволяющие писать в таком стиле:

var MyClass = new Class({
    myMethod: function() { }
});

var MyNamespace = {
    myFunction : function() { return 10; }
}

MyNamespace.myFunction();

Однако такой подход имеет ряд недостатков:

  • Невозможно «ссылаться» на элемент тогоже уровня, например при наследовании классов в одном пакете, т.к. инициализация «пакетного» объекта во время конструирования класса еще не произошла и класс, от которого хочется отнаследоваться, недоступен
  • Неудобно описывать «приватные» функции и переменные — их приходится выносить за объявление пространства имен/класса, что затрудняет чтение кода

Для того, чтобы побороть оба этих недостатка, я построил библиотеку-обертку вокруг MooTools, реализующую маленький «встраевыемый язык» для описания классов/пространств имен следующим образом:
Читать полностью »

в 16:44, , рубрики: javascript

Компания MajorSecurity опубликовала описание уязвимости в браузере Safari Mobile под iOS 5.1. C помощью этой уязвимости можно подделать адрес в адресной строке.

Проблема связана с некорректной обработкой вызова javascript's window.open() в JavaScript. Баг позволяет отобразить в адресной строке URL чужого сайта, тем самым жертву можно ввести в заблуждение.

Чтобы продемонстрировать уязвимость на практике, специалисты сделали специальную тестовую страничку. Можете зайти на неё браузером Safari из-под iOS 5.1 — и нажать кнопку Demo.

http://majorsecurity.net/html5/ios51-demo.html

Баг в браузере Safari

После того как вы нажали кнопку Demo браузер Safari откроет новое окно, где в адресной строке указано www.apple.com, но на самом деле сайт apple.com открывается во фрейме на хосте majorsecurity.net, то есть фактически пользователь не покинул сайт majorsecurity.net.

Читать полностью »

1...1020...568569570...577
Главная   |  Архив новостей  |   Android  |   Google  |   Apple  |   Microsoft  |   Информационная безопасность  |   Веб – разработка
Публикации RSS  |  Комментарии RSS
https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js