Инглекс



admitad.partner



Интернет-магазин, который платит

Как создать облако тегов? Вариант №2.

Информация, представленная в этой статье ориентирована в первую очередь для начинающих web-мастеров.

Внешне практически ничем не отличается от первого варианта. Отличия наблюдаются только в коде.

Демо-пример

Вариант удаленного подключения с сайта //neotech.3dn.ru


Скопируйте и вставьте данный код в раздел body в то место, где будет располагаться «облако»:

<div id="yoblako" align="center"><noindex>
    
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    <a style="font-size:8pt;" href="ССЫЛКА" rel="nofollow" class="eTag eTagGr8">НАЗВАНИЕ</a>
    
    </noindex></div>


<script type="text/javascript" src="//neotech.3dn.ru/Tegs/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.mode = 'tags';
flashvars.minFontSize = '8';  /* минимальный размер  шрифта в облаке. Размер задается в пунктах.*/
flashvars.maxFontSize = '12';  /* максимальный размер  шрифта в облаке. Размер задается в пунктах.*/
flashvars.tcolor = '0x006600';  /* "0x006600" - цвет самого частого текста в облаке тегов в RGB формате. Частота текста определяется по свойству ссылки style. 0x не меняем. */
flashvars.tcolor2 = '0x006600'; /* "0x006600" - цвет самого редкого текста в облаке тегов в RGB формате. Частота текста определяется по свойству ссылки style. 0x не меняем. */
flashvars.hicolor = '0xFF0000';   /* "0xFF0000" - цвет текста при наведении на него курсора. 0x не меняем. */
flashvars.distr = 'true';   /* тип вращения облака, может принимать значение "true" или "false" */
flashvars.tspeed = '100'; /* скорость вращения */
eTagz = document.getElementById('yoblako').getElementsByTagName('A');
flashvars.tagcloud = '<tags>';
for (var i=0; eTagz[i]; ++i) flashvars.tagcloud += '<a href=\'' + eTagz[i].getAttribute('href')
+ '\' style=\'' + parseInt(eTagz[i].style.fontSize)
+ '\'>' + eTagz[i].innerHTML.replace(/&/i, '%26') + '</a>';
delete eTagz;
flashvars.tagcloud += '</tags>';
var params = {};
/* params.wmode = 'transparent';  устанавливаем фон облака прозрачным. Если убрать эту строку, то можно будет самим задавать цвет фона. */
params.bgcolor = '#FFFFCC';
params.allowscriptaccess = 'always';
var attributes = {};
attributes.id = 'yoblako';
attributes.name = 'tagcloud';
swfobject.embedSWF('//neotech.3dn.ru/Tegs/tagcloud.swf', 'yoblako', '700', '450', '9.0.0', false, flashvars, params, attributes);          /* "700" - ширина будущего облака тегов в пикселях.
                        "450" - высота будущего облака тегов.
                         "9" - максимальная версия флеш-плеера, которая нужна для отображения облака. */
</script>

Вариант локального подключения вспомогательных файлов

Если не работает вариант удаленного подключения, скачайте исходный материал с локальным подключением файлов swfobject.js и tagcloud.swf.


Исходники (1,4 кб)

Если возникают проблемы при скачивании файлов, например, через браузер, скопируйте ссылку (правая кнопка мыши → копировать адрес ссылки) и скачайте файл через Download Master.

Проставьте адреса и названия ссылок. При необходимости, произведите некоторые настройки.


Спасибо за внимание. Надеюсь, урок был Вам полезен. До встречи на следующих уроках. Л.М.



Мир вокруг нас. Интересные факты.



Ваше мнение по материалу, изложенному на сайте








  © 2015–2021  dynamic-site.olerant.ru  L.M. Служба поддержки RSS подписка подписка Продажа, покупка  трафика