Многие наверно видели красивые облака тегов в 3d, и наверняка хотели бы такое облако на свой сайт, но из-за нехватки навыков или не знания языков программирования, к сожалению не все могут это себе позволить. В этой статье я расскажу как очень просто сделать такое облако с помощью обычной вставки готового кода HTML на страницу вашего HTML-сайта.
Пример такого облака можно посмотреть здесь.
Итак разместите в теге <head> на любой из ваших страниц следующий код.
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="http://websitehelp.ru/3dcloud/swfobject.js"></script>
<script type="text/javascript">
function myTags(mytags){
mytags=mytags.replace(/<A/g, '<a')
.replace(/\/A>/g, "/a>")
.replace(/(\starget=_)(\w*)/g, ' target="_$2"')
.replace(/(\sclass=)(?!")(\w*)/g, ' class="$2"')
.replace(/(\sname=)(?!")(\w*)/g, ' name="$2"')
.replace(/(\sid=)(?!")(\w*)/g, ' id="$2"')
.replace(/(\srel=)(?!")(\w*)/g, ' rel="$2"');
mytags=encodeURIComponent(mytags).replace(/!/g, '%21')
.replace(/'/g, '%27').replace(/\(/g, '%28')
.replace(/\)/g, '%29').replace(/\*/g, '%2A');
var rnumber = Math.floor(Math.random()*9999999);
var flashvars = {
tcolor:"0x2A62C8",
tcolor2:"0x000000",
hicolor:"0xB12AC8",
tspeed:"110",
distr:"true",
mode:"tags",
tagcloud:mytags
};
var params = {
allowScriptAccess:"always",
wmode:'transparent'
};
var attributes = {
id:"flash_cloud"
};
swfobject.embedSWF("http://websitehelp.ru/3dcloud/tagcloud.swf?r="+rnumber,
"tags", "300", "220", "9.0.0",
"expressInstall.swf", flashvars,
params, attributes);
}
window.onload=function(){
var mytags="<tags>"
+document.getElementById('tags').innerHTML
+"</tags>";
myTags(mytags);
};
</script>
Далее в теге <body> разместите свои ссылки с тегами в таком вот виде. Чтобы установить размер тегов в коде style="font-size: 10px" измените значение по вашему усмотрению.
<div id="tags">
<a href="ссылка на страницу"
rel="nofollow" class="myclass" name="myid"
title="Mytitle here" id="myid" target="_blank"
style="font-size: 10px;">название страницы </a>
<a href="ссылка на страницу 2"
rel="nofollow" class="myclass" name="myid"
title="Mytitle here" id="myid" target="_blank"
style="font-size: 10px;">название страницы 2</a>
</div>
Облако готово, с полной статьёй вы можете ознакомиться по этой ссылке.Спасибо Александру Ермилову.
Источник: Как просто сделать 3D облако тегов с помощью обычной вставки готового кода HTML на страницу вашего HTML-сайта. | 