Шрифт с начертание шрифта: жирный

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

• Нет оптимального Suchmaschinerkennung
• Высокая поправки и административные расходы
• Текст не copyable
• Проблема доступности

Кроме того, решение фотографии будут sIFR быть известным способом. Вот текст из конкретных теги HTML для чтения и заменен Flash фильм со встроенными шрифтами. хороши в теории, на практике крайне сложно из-за высокого усилия конфигурации.

Следуя тому же принципу работает в JS-плагин Шрифт . Только он более практичен в использовании.
Следующий код связывает обычным шрифтом, а позже описал Жирным шрифтом:

  1
 2
 3

  "typeface-0.14.js" ><!-- mce : 0 --></ script > <SCRIPT SRC = "typeface-0.14.js"> <! - МКО: 0 --></ SCRIPT>
 "mysrcFont.typeface.js" ><!-- mce : 1 --></ script > <SCRIPT SRC = "mysrcFont.typeface.js"> <! - МКО: 1 --></ SCRIPT>
 "mysrcFontBold.typeface.js" ><!-- mce : 2 --></ script > <SCRIPT SRC = "mysrcFontBold.typeface.js"> <! - МКО: 2 --></ SCRIPT> 

Чтобы текст zuzuweißen соответствующий шрифт, вы просто используете заявление CSS семейство шрифтов.

  1
 2

  <div id="text" style="font-family: mySrc Font;">
 Лорум ipsolum ...</ DIV> 

Имя атрибута в Сыле использовать шрифты можно читать в каждом из JS файлов.
Все это имеет два недостатка, как описано на веб-сайт будет иметь ее. Проблемы с производительностью при больших объемах текста, а также стандартные CSS Hovereffekte больше не работает.
Это будут преобразованы в JavaScript файла шрифтов OpenType Truetype или отформатировать один должен существовать. Не всегда в этих работах, смелые версии интегрированы. Для того, чтобы получить власть, вы можете экспортировать инструмент для редактирования шрифтов, только версия Bold и конвертировать их. Добавляет 1 теперь эти два JS файлы и присваивает шрифта Bold элемент HTML, что произошло с точностью до ошибки вывода на консоль Firebug, ничего.
Решение этой проблемы простое. Шрифт преобразователя на комплексной сайте Шрифт также содержится информация о шрифтов, почему селектора CSS, что информация необходима также:

  1
 2
 3
 4
 5
 6
 7
 8

  # Текст (
   mySrc Font , Verdana , Arial ; семейство шрифтов: mySrc шрифт Verdana, Arial;
 )

 # (BoldFont
   mySrc Boldfont , Verdana , Arial ; семейство шрифтов: mySrc Boldfont, Verdana, Arial;
   bold ; начертание шрифта: жирный;
 ) 

Так обходной путь для вложения нормальных и жирным шрифтом является совершенным.

Альтернативой sIFR JavaScript Cufón -
sIFR 3 r436 - прокрутка проблемы в Firefox 3, IE6 / 7

jMediaelement - JQuery HTML5 Аудио-Видео Kit

После долгого времени я теперь снова мелочь для вас.
На мой взгляд, момент, вероятно, лучший HTML 5 Media Player.
jMediaelement прослушивания аудио и видео файлов, и от всех браузера любой HTML-5 требуется поддержка запасного для Flash и VLC.

Игрок собирается CSS и полностью поддерживает все основные форматы файлов stylebar, таких как: OGG (Theora / Vorbis), mp4/mov (h.264), Webm (VP8/vorbis), FLV, Youtube видео и многое другое.

Осуществление игрока очень проста и хорошо документированы .

Практика Подсказка - jqTransform ошибка при вводе в Firefox> 3.5.2

Кто вы по jqTransform использует, пожалуй, последнее обновление Firefox идентификатор пользователя, чтобы текст в материалах, не сидит аккуратно посередине.
Относится к Firefox 3.5.2.

Целом пожертвовано на новый движок, что Firefox получил.
Чтобы получить проблему под контролем, не побочные эффекты, чтобы получить ваш браузер позволяет легко для других следующее.

Ваш jqtransform.css на, в соответствии 90 (. JqTransformInputInner Div ввода () сменных сейчас высота 31px на вашем авто.

Вот и все ....

JQuery функции нагрузки - простой способ Ajax (Часть 1)

Нагрузки функции могут быть просто HTML элементы файл в текущем пасты. Эта функция в первую очередь для "импорта" код HTML в свои мысли, и поэтому не соответствуют типичным запрос Ajax в примере скрипта имеется доступ, данные из базы данных не прочитает и / или постучать по отношению к другим процессам сервера.

Так обстоит дело с первой теории, вызов функции выглядит следующим образом:

  1

  ) . load ( '/someFile #mydiv' ) ; $ ('# SomeElement'). Нагрузки ('/ # somefile myDiv'); 

Так мало, что просто. В элемент с идентификатором "someElement" DIV-ов, все содержание "myDiv" загружен идентификатор. Удачный то, что "myDiv" вовсе не в текущий документ, но в файле "somefile".
Второй параметр, функция также загружать данные в качестве так называемых пар ключ / значение прошли его.

  1

  ) . load ( 'someFile.php' , { 'param' : 'someValue' } ) ; $ ('# SomeElement'). Нагрузки ('someFile.php', ('параметр': 'someValue')); 

Это соответствует, однако, теперь больше похожа на нормальную запрос Ajax. Один или несколько пар ключ / значение передаются в PHP скрипт после параметра. Конечно, один теряет преимущество и в предыдущем примере с другими элементами HTML из сценария, чтобы получить DOM просто. Но если вы спрашиваете одной прямой без дальнейшей обработки приведет элемент вставки, что является очень простой и удобный вариант.

В следующей части будет продвинулись от других вариантов, таких как получить JQuery Ajax, getJSON и т.д. идти.

Jquery - Нажмите проводником и удалить элементы, назначить

Нажмите кнопку обработчик функции, вероятно, одна из наиболее часто используемых при работе с JQuery. Редко получить там и без них.
Я хочу вас представить сегодня некоторые тонкости в короткое время сделать это.

Выберите пункт, чтобы добавить обработчик
Элемент mitzugeben нажмите обработчик, вероятно, самый легкий.

  1
 2
 3

  ) . click ( function ( ) { $ ('# IdDesElements'). Нажмите кнопку (функция () (
 "Click handler ausgelöst!" ) ; окно оповещения. ("Нажмите срабатывает обработчик");
 )); 

Mehrer Нажмите кнопку Добавить элемент обработчика
Элемента можно объяснить больше, чем просто нажмите обработчик назначены.
Пункт нажатии любой обработчик, в свою очередь, экспортированных в.

  1
 2
 3
 4
 5
 6

  ) . click ( function ( ) { $ ('# IdDesElements'). Нажмите кнопку (функция () (
 "Click handler 1!" ) ; окно оповещения. ("Нажмите обработчик");
 ));
 ) . click ( function ( ) { $ ('# IdDesElements'). Нажмите кнопку (функция () (
 "Click handler 2" ) ; окно оповещения. ("Нажмите обработчик 2");
 )); 

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

  1

  ) . unbind ( 'click' ) ; $ ('# IdDesElements'). Unbind ('нажмите'); 

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

  1
 2
 3

  ) . unbind ( 'click' ) . click ( function ( ) { $ ('# IdDesElements'). Unbind (должен прозвучать щелчок). Нажмите кнопку (= функция () (
     "neuer Click handler ausgelöst!" ) ; окно оповещения. ("Нажмите обработчик вызвал новый");
 )); 

Нажмите кнопку обработчик и якорь
При нажатии ссылки на якорь обработчика звонков, но не будет браузера, следует ссылку, после обработчик называемые ложные должны также просто возврат;

  1
 2
 3
 4

  ) . click ( function ( ) { $ ('# IdDesElements'). Нажмите кнопку (функция () (
 "Click handler" ) ; окно оповещения. ("Нажмите обработчик");
     ; вернуться ложным;
 )); 

JQuery HowTo: Обход

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

Что здесь произошло? Основа этой структуры HTML:

  1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19

  <div id="someParent" style="border: 1px пунктирной #ccc"> родителей
 <div>
  Child1
 </> Div
 <div class="move">
  Child2
 </> Div
 <div>
  Child3
 </> Div
 not"> <div class="move
  Child4
 </> Div
 </> Div

 <div id="someWrapper">
 <a href="#"> ID = "Testone" Переместить все </ A>
 <a id="testtwo" href="#"> Переместить отфильтрованные </ A>
 </> Div 

Следующий код JavaScript выполняет анимацию. На основании связь с методами родителя "someWrapper" выбрали DIV, предыдущий пункт по сравнению с предыдущим с "someParent" и, наконец, с идентификатором детей всех элементов в рамках "someParent выбран.
Код в примере лишь иллюстративный характер. Анимированные элементы, которые будут только на структуру DOM нашли.

JQuery код "Переместить все":

  1
 2
 3
 4

 ) . click ( function ( ) { jQuery ( this ) . parent ( ) . prev ( ) . children ( ) . animate ( { 'paddingLeft' : '20px' } , 200 ) ; return false ; } ) ; JQuery ("# Testone"). (() (JQuery (это). родителя (). предыдущая (). детей (). оживить (('paddingLeft: "'20px'), 200) вернуться ложным кликом мыши;) ); 

Теперь для расширенной версии. Основой для Jquery функции фильтра и не очень.
JQuery код "Переместить фильтруется":

  1
 2
 3
 4

  ) . click ( function ( ) { JQuery ("# testtwo"). кнопку (функция () (
    ) . parent ( ) . prev ( ) . children ( ) . filter ( ".move" ) . not ( ".not" ) . animate ( { 'paddingLeft' : '20px' } , 200 ) ; JQuery (это). родителя (). предыдущая (). детей (). фильтра (". ход"). нет (". нет"). оживить (('paddingLeft': '20px '), 200);
     ; вернуться ложным;
 )); 

JQuery презентации для лучшего понимания

Еще и еще раз натыкаясь на интересные материалы о JQuery в сети.
Сегодня я хочу представить некоторые из моих любимых.

подробнее

Предложение: кнопка ширина набор jqTransform

Так мило и красивый jqTransform плагин , оно делает мкА, но некоторые небольшие проблемы. В дополнение к различным толкованием ширина текстовых полей в IE и FF, можно также установить ширину стандартной кнопки не владеют набор CSS.

Если вы хотите сделать это и не можете найти соответствующие настройки, которая получила название по небольшой помощью здесь. Поэтому вы jqtransform.css открыто и выбора Z.36 "button.jqTransformButton службы службы" новую ширину собственности назначить.
Это может быть, например, следующим образом:

  1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13

 background : transparent url ( img/btn_left.gif ) no-repeat top left ; color : #333 ; padding : 10px 4px 0px 8px ; font-weight : normal ; font-size : 12px ; line-height : 13px ; display : block ; text-decoration : none ; height : 33px ; width : auto ; min-width : 100px ; } кнопку. jqTransformButton службы промежуток времени (справочная информация: URL (IMG / btn_left.gif) нет-повторяю левый верхний прозрачный; цвета: # 333; обивка: 10px 0px 4px 8px; начертание шрифта: нормальный; размер шрифта: 12px; высота строки : 13px; отображения: блок; текст-отделка: нет; высота: 33px; ширина: авто; мин-ширина: 100px;) 

Практика Подсказка - jqTransform ширина ошибке

Кто jqTransform использовали когда-то уже наверняка обнаружили, что Internet Explorer и Firefox браузер, текстовые поля разной ширины дисплея.
Это объясняется тем, что размер атрибутов, даже если не в поле ввода на якоре в IE учитывается.

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

Теперь для обхода проблемы:

  1
 2
 3
 4
 5

 ( $input. attr ( 'size' ) ) { inputSize = $input. attr ( 'size' ) * 10 ; $input. css ( 'width' , inputSize ) ; } / / Z. 107 в jquery.transform.js если ($ ввода. ATTR ('размер')) ($ = InputSize ввода. ATTR ('размер') * 10, $ ввода. Css ('Ширина, InputSize) ;) 

Этот фрагмент кода вы можете удалить его, потому что это приводит к неправильным расчетом ширина текстовых полях. Я не мог обнаружить какой-либо нежелательных побочных эффектов. Если вы найдете что-то, я был бы признателен за комментарии.

Jquery - доступное-РИА - Виджеты для всех

Сегодня утром я обнаружил, что-нибудь хорошее, и я хотел бы вкратце упомянуть.
Jquery - доступное РИА- это набор нескольких простых в установке виджетов, которые все 100% WAI WCAG 2.0 и WAI АИРА соответствуют.
Специально для разработчиков целом передняя интересно. Есть ли какая-страницы, но вполне доступным для каждого.

Целом основывается на JQuery интерфейса виджеты и включают следующее:

• Лайтбокс ( демо )
• Форма ( демо )
• Полные ( демо )
• сортировки таблицы ( демо )

Вся информация о проекте, а также демо, документы и т.д. находятся в Вики GitHub .