Pull to refresh

WebSlices в Internet Explorer 8.0

Reading time3 min
Views920

Вступление


Я не являюсь большим поклонником Internet Explorer, однако новая функциональность тестового билда вышедшего позавчера IE8, меня заинтересовала.
Честно говоря, изначально я решил, что это нечто вроде возможности добавления куска страницы в дешборд из Сафари. Однако, потыкав мышкой по странице, я понял, что дело совсем в другом.
Я думаю, что те, кому надо, уже знают об этой возможности давно, ну, а тем кому интересно, прошу почитать эту краткую заметку.


Что же это такое?


Вообще, идея очень даже приятная. Возможность предоставления пользователю блоков, которые он сможет добавлять себе в избранное. Очень удобно, для слежения за обновляющейся информацией, причём заходить на саму страницу не надо. Кроме того, реализация предпологает наличие большого числа таких блоков, связь блоков с информационным источником (скажем RSS), разный дополнительный функционал (скажем, описание ttl — time to live, времени актуальности блока) и даже аутентификацию.

Но самое приятное это реализация. Это не новая разметка, не новый неподдерживаемый тег хтмл, не расширение джава скрипта и даже не новый activeX-контрол. Это микроформат. Вообще здорово, что Майкрософт ими пользуется… можно сказать в народ пошла. Таким образом, вне ИЕ8 такой блок останется просто блоком… а вот в «исследователе интернета» блок подсветится специальным значком и появится возможность добавить его к себе в закладки.

Рассмотрим пример


Итак, как только я понял, что это такое, подобно чувству учёного начала 20го века, сразу же возникло желание попробовать это на себе.
Имеем страницу, на которой один блок время от времени обновляется. На самом деле, туда выводится последняя строчка из Твиттера.

Страница

Требуется — создать WebSlice, показывающий эти самые обновления.

Все крайне просто, пишем следующий код в страницу:
<div class="hslice" id="twitter_updates">
	<div class="entry-title" style="display:none">Mee's Twitter Updates</div>
	<div class="entry-content">
                        %Содержание блока%
        </div>
        
</div>


Получается вот такое:


В списке подписок на RSS появляются теперь и слайсы:


При наведении на блок, возникает характерный знак:


А вот так оно выглядит во время работы:


Формат простейшего слайса очень прост:
1. Оформить его в элемент с классом hslice
2. Добавить два блока
а) entry-title — название слайса. Что интересно, без него не работает. Так что пришлось его прятать при помощи display:none
б) entry-content — содержимое слайса

bolk добавляет:
Это называется «микроформат», причём «entry-title» и «entry-content» — части микроформата hAtom. Класс «hslice» можно вешать на любой элемент, не обязательно div.
Вот в общем-то и всё.

Теперь о некоторых подводных камнях:


Во-первых, без entry-title'a у меня не заработало. Конечно, не камень, но стоит иметь ввиду.
Во-вторых возникают некоторые проблемы с СSS, к примеру inline-css не отразил мне background с картинкой, а стиль ссылки вообще так и не заработал (впрочем, делал я это вчера в пол четвертого ночи… как-то захватила внезапно тяга к знаниям).

donpedro Указывает на дополнительные проблемы:
1. Без указания ID в блоке он не определяется слоем.
2. С кодировкой windows-1251 просмотр слоя из избранного превращается в просмотр знаков препинания (у меня только кириллические символы были). Установка кодировки UTF-8 спасла ситуацию.

Выводы


Как мне кажется, отличная штука. При минимальных затратах, можно расширить свой сервис этими маленькими слайсами, как это уже сделали Facebook, Ebay и другие, и получить отличную обновлялку информации которая вам нужна. Я уже предстляю как много сервисов я бы туда засунул. Да-да… всё из-за нехватки дешборда в винде и линухе :) Впрочем, ждём реализации под FireFox. Почему бы и нет? :)

Если у вас есть IE8, попробовать слайс вот тут можно уже сейчас (ни в коем случае не реклама, ибо там ничего нет)
а официальное описание доступно вот тут:
Internet Explorer 8 Beta 1 Whitepapers
Tags:
Hubs:
+27
Comments97

Articles

Change theme settings