Jump to content
  • 0

3D облако тэгов

Vadim-Oblivion

Asked by Vadim-Oblivion,

 Share

Question

Vadim-Oblivion Explorer

Vadim-Oblivion

Posted
Posted

Доброго времени суток уважаемые спецы. Помогите пожалуйста решить проблему:

Заказчик хочет навигацию в виде 3х облаков тэгов по разным темам, проблема в том что бы поместить все 3 облака на одну страницу.

На данный момент облака на разных страницах (http://www.site-devga.ru/test/index.html), подскажите как можно свести их на одну или может есть другой вариант решения проблемы.

Вот сам код страницы

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru"><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /><title>Красивые обои для рабочего стола скачать бесплатно без регистрации</title><script type="text/javascript" src="swfobject.js"></script><script type="text/javascript">	function  myTags(mytags){		mytags=mytags.replace(/<A/g, '<a')			.replace(/\/A>/g, "/a>")			.replace(/(target=_)(\w*)/g, 'target="_$2"')			.replace(/(class=)(?!")(\w*)/g, 'class="$2"')			.replace(/(name=)(?!")(\w*)/g, 'name="$2"')			.replace(/(id=)(?!")(\w*)/g, 'id="$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:"0x267fe3",			hicolor:"0x888888",			tspeed:"120",			distr:"true",			mode:"tags",			tagcloud:mytags		};		var params = {			allowScriptAccess:"always",			bgcolor:'#ffffff'		};		var attributes = {			id:"flash_cloud"		};		swfobject.embedSWF("tagcloud.swf?r="+rnumber,						   "tags", "300", "240", "9.0.0",						   "expressInstall.swf", flashvars,						   params, attributes);	}	window.onload=function(){ 		var mytags="<tags>"		+document.getElementById('tags').innerHTML		+"</tags>";		myTags(mytags);	};</script>		</head><body><div id="tags">	<a href="../../../lesson.php?cat=html" style="font-size:11px;">HTML</a>	<a href="../../../lesson.php?cat=php" style="font-size:11px;">PHP</a>	<a href="../../../lesson.php?cat=swf" target="_blank" style="font-size:11px;">Flash</a>	<a href="../../../lesson.php?cat=ajax" style="font-size:11px;">Ajax</a>	<a href="../../../lesson.php?cat=ocss" style="font-size:11px;">CSS</a>	<a href="../../../lesson.php?cat=js" style="font-size:11px;">JavaScript</a>		<a href="../../../lesson.php?cat=jq" style="font-size:11px;">Уроки по JQuery</a>	<a href="../../../lesson.php?cat=omysql" style="font-size:11px;">Основы MySQL</a>	<a href="../../../file.php?cat=template" style="font-size:11px;">Шаблоны</a></div>	</body></html>

Заранее спасибо!

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0
Vadim-Oblivion Explorer

Vadim-Oblivion

Posted
  • Author
Posted

Как то так.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru"><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /><title>2 3D облака</title><script type="text/javascript" src="swfobject.js"></script><script type="text/javascript">	function  myTags(mytags){		mytags=mytags.replace(/<A/g, '<a')			.replace(/\/A>/g, "/a>")			.replace(/(target=_)(\w*)/g, 'target="_$2"')			.replace(/(class=)(?!")(\w*)/g, 'class="$2"')			.replace(/(name=)(?!")(\w*)/g, 'name="$2"')			.replace(/(id=)(?!")(\w*)/g, 'id="$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:"0x267fe3",			hicolor:"0x888888",			tspeed:"120",			distr:"true",			mode:"tags",			tagcloud:mytags		};		var params = {			allowScriptAccess:"always",			bgcolor:'#ffffff'		};		var attributes = {			id:"flash_cloud"		};		swfobject.embedSWF("tagcloud.swf?r="+rnumber,						   "tags", "300", "240", "9.0.0",						   "expressInstall.swf", flashvars,						   params, attributes);	}	window.onload=function(){ 		var mytags="<tags>"		+document.getElementById('tags').innerHTML		+"</tags>";		myTags(mytags);	};</script><script type="text/javascript" src="swfobject2.js"></script><script type="text/javascript">	function  myTags(mytags){		mytags=mytags.replace(/<A/g, '<a')			.replace(/\/A>/g, "/a>")			.replace(/(target=_)(\w*)/g, 'target="_$2"')			.replace(/(class=)(?!")(\w*)/g, 'class="$2"')			.replace(/(name=)(?!")(\w*)/g, 'name="$2"')			.replace(/(id=)(?!")(\w*)/g, 'id="$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:"0x267fe3",			hicolor:"0x888888",			tspeed:"120",			distr:"true",			mode:"tags2",			tagcloud:mytags		};		var params = {			allowScriptAccess:"always",			bgcolor:'#ffffff'		};		var attributes = {			id:"flash_cloud"		};		swfobject.embedSWF("tagcloud2.swf?r="+rnumber,						   "tags", "300", "240", "9.0.0",						   "expressInstall2.swf", flashvars,						   params, attributes);	}	window.onload=function(){ 		var mytags="<tags2>"		+document.getElementById('tags').innerHTML		+"</2tags>";		myTags(mytags);	};</script>		</head><body><div id="tags">	<a href="../../../lesson.php?cat=html" style="font-size:11px;">HTML</a>	<a href="../../../lesson.php?cat=php" style="font-size:11px;">PHP</a>	<a href="../../../lesson.php?cat=swf" target="_blank" style="font-size:11px;">Flash</a>	<a href="../../../lesson.php?cat=ajax" style="font-size:11px;">Ajax</a>	<a href="../../../lesson.php?cat=ocss" style="font-size:11px;">CSS</a>	<a href="../../../lesson.php?cat=js" style="font-size:11px;">JavaScript</a>		<a href="../../../lesson.php?cat=jq" style="font-size:11px;">Уроки по JQuery</a>	<a href="../../../lesson.php?cat=omysql" style="font-size:11px;">Основы MySQL</a>	<a href="../../../file.php?cat=template" style="font-size:11px;">Шаблоны</a></div><div id="tags2">	<a href="../../../lesson.php?cat=html" style="font-size:11px;">HTML</a>	<a href="../../../lesson.php?cat=php" style="font-size:11px;">PHP</a>	<a href="../../../lesson.php?cat=swf" target="_blank" style="font-size:11px;">Flash</a>	<a href="../../../lesson.php?cat=ajax" style="font-size:11px;">Ajax</a>	<a href="../../../lesson.php?cat=ocss" style="font-size:11px;">CSS</a>	<a href="../../../lesson.php?cat=js" style="font-size:11px;">JavaScript</a>		<a href="../../../lesson.php?cat=jq" style="font-size:11px;">Уроки по JQuery</a>	<a href="../../../lesson.php?cat=omysql" style="font-size:11px;">Основы MySQL</a>	<a href="../../../file.php?cat=template" style="font-size:11px;">Шаблоны</a></div>	</body></html>
Link to comment
Share on other sites
  • 0
Veseloff Explorer

Veseloff

Posted
Posted

А вы ыообще понимаете что этот код делает и как хотя бы примерно всё работает. Потому что сейчас кроме тупейшей копипасты я не вижу ничего. У меня было предположение с самого начала почему у вас не работает и сейчас оно подтверждается, но я бы хотел, чтобы вы немного подумали и сами всё сделали. Если что — подскажем, не проблема.

Link to comment
Share on other sites
  • 0
Vadim-Oblivion Explorer

Vadim-Oblivion

Posted
  • Author
Posted

В общем решил задачу через iframe, сделал вставку страницы в страницу

<!doctype html><html><head><meta charset="utf-8"><link rel="shortcut icon" href="/favicon.ico">			<!-- Добавляем иконку сайта --><link href="css/style.css" rel="stylesheet" type="text/css">	<!-- Подключаем таблицу стилей --><title>Название сайта</title></head><body><div style="text-align:center;">    <div style="display:inline-block;">	<div id="main">            <div id="header">            	<h1>Название сайта</h1>            </div>                        <div id="kontent">                <iframe name="myIframe" src="1.shtml" id="block_nav">                </iframe>                                <iframe name="myIframe" src="2.shtml" id="block_nav">                </iframe>                                <iframe name="myIframe" src="3.shtml" id="block_nav">                </iframe>	    </div>                        <div id="footer">            </div>	</div>    </div></div></body></html>

А в каждой вставляемой странице:

<html><head><meta charset="utf-8"><title>1</title><!-- подключаем скрипт облака тегов --><script type="text/javascript" src="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:"0x3E3013",			tcolor2:"0x000000",			hicolor:"0x000000",			tspeed:"100",			distr:"true",			mode:"tags",			tagcloud:mytags		};		var params = {			allowScriptAccess:"always",			wmode:'transparent'		};		var attributes = {			id:"flash_cloud"		};		swfobject.embedSWF("tagcloud.swf?r="+rnumber,						   "tags", "300", "300", "9.0.0",						   "expressInstall.swf", flashvars,						   params, attributes);	} 	window.onload=function(){ 		var mytags="<tags>"		+document.getElementById('tags').innerHTML		+"</tags>";		myTags(mytags);	};</script> 	</head><body><div id="tags">	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a>	<a href="autojurist.html" target="_top" style="font-size:10px;">Автоюрист</a></div>	</body></html>

Как то так. Если кому потребуется то воть, пожалуйста.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing

  • Similar Content

    • jksnf
      CSS transition
      By jksnf
      Не работает transition при появлений модального окна:
      <a class="btn">Modal</a> <div class="modal"> <div class="overlay"> <div class="content"> <a class="close">X</a> <h1>Title</h1> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt repellat asperiores rerum animi officiis minus corporis iure voluptate accusantium, ut optio ratione iusto nemo delectus. Quasi illum libero dolorum neque?</p> </div> </div> </div> //scss .modal .overlay{ position: fixed; top: 0;left: 0; width: 100%;height: 100%; background: rgba($color: #000000, $alpha: .8); z-index: 1; display: none; } .modal .content{ width: 500px;height: 200px; position: absolute; top: 50%;left: 50%; transform: translate(-50%, -50%); background-color: #fff; z-index: 2; text-align: center; display: none; a{ line-height: 30px; font-weight: bold; color: #fff; top: -50px;; position: absolute; right: -50px; font-size: 40px; padding: 10px; } h1{ margin-bottom: 20px; } } .modal.active .overlay{ display: block; } .modal.active .content{ display: block; } //Jquery $(document).ready(function(){ $(".btn, .close").click(function() { $(".modal").toggleClass("active") }) }) Я понимаю что на display не работает transition. но и нельзя ставить opacity т.к перекрывает контент сзади него изначально.

      Что делать?
    • IsayR
      Как правильно сделать раскрывающиеся блоки со скрытым содержанием внутри?
      By IsayR
      Всем привет! Подскажите, пожалуйста, как правильно сделать раскрывающиеся блоки со скрытым содержанием внутри? У меня в принципе все работает, блок открывается и закрывается, НО если я нажимаю на блок, а не на стрелочку, она у меня остается в таком же положении(а она должна у меня меняться, когда блок открывается), и получается куча мала, и выглядит это не очень презентабельно. Подскажите, пожалуйста!
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="wrapper-div"> <div class="div"> <div class="window-one"> <h3 class="title"> Заголовок 1 </h3> <div class="arrow-test"></div> </div> <div class="window-two"> <div class="text">Текст 1</div> </div> </div> </div> <div class="wrapper-div"> <div class="div"> <div class="window-one"> <h3 class="title"> Заголовок 2 </h3> <div class="arrow-test"></div> </div> <div class="window-two"> <div class="text">Текст 2</div> </div> </div> </div> <div class="wrapper-div"> <div class="div"> <div class="window-one"> <h3 class="title"> Заголовок 3 </h3> <div class="arrow-test"></div> </div> <div class="window-two"> <div class="text">Текст 3</div> </div> </div> </div> .div{ border: 1px solid #3A444E; border-radius: 10px; width: 300px; height: 64px; overflow: hidden; } .div.open { height: auto; background: #000; color: #fff; } .window-one { display: flex; align-items: center; justify-content: space-between; } .title { margin-bottom: 20px; } .arrow-test { content: ''; background: url('http://cdn.onlinewebfonts.com/svg/img_387044.png') no-repeat center center / 100%; width: 30px; height: 30px; cursor: pointer; } .arrow-test.open { content: ''; background: url('https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Eo_circle_yellow_arrow-up.svg/1024px-Eo_circle_yellow_arrow-up.svg.png') no-repeat center center / 100%; width: 30px; height: 30px; cursor: pointer; } $('.div, .arrow-test').click( function(){ $(this).toggleClass('open')});  
    • Алеся
      Оцените, пожалуйста, работу. Буду благодарна за советы и критику.
      By Алеся
      Всем привет! Хотела бы представить свою работу новичка на обсуждение для получения конструктивной критики и/или советов, взглядов что можно улучшить или изменить, общее впечатление, конечно, тоже интересует.   https://alesia-k.github.io/Tajam-template/
      Обратите, пожалуйста, внимание на:
      - блок "MEET OUR AMAZING TEAM". Немного не нравится как смещаются item при наведении мыши, как будто немного дергаются. Так ли по-вашему это должно работать или такое поведение блока нужно изменить?
      - инпут "subscribe" в футторе. При клике на инпут, немного смещается и сам инпут, и рядом стоящая кнопка. Было бы классно, если бы подкинули идею как сделать, чтобы такого не было.
      - и почему-то при клике на <a href="tel:(+62)2122243333">(+62)21-2224 3333</a>   не идет процесса соединения.
      Заранее спасибо!
    • Only091
      Как сделать постраничную навигацию.
      By Only091
      Помогите пожалуйста, не получается сделать постраничную навигацию. Делал все по урокам. в Итоге получилось сделать два разных каталога один с фильтрами другой с постраничной навигацией. И теперь я пытаюсь объединить два каталога. Но не получается. Сами файлы урока в архике каталог. Буду очень благодарен если мне помогут! catalog.phpcatalogDB.js
      каталог.7z
    • Alexand
      Оцените вёрстку макета — Furniture
      By Alexand
      Здравствуйте дорогие специалисты програмирования.
      Взываю вас о помощи!? Прощу Вас уделите мне своё безценное время. Я который раз выполняю тестовое задание для трудоустройства, а мне постоянно отказывают. Я уже в замешательстве, что же я делаю не так. Я просил их, дать мне хоть какую-то критику, единственное что мне отвечают СЛАБО. Но что именно слабо не говорят!
      Прошу Вас рассмотреть мою из последних тестовую работу и укозать мне ВСЕ мои прогрехи, по полной строгости. Единственная надежда на Вашу благосклонность и доброту.
      Вот ссылка на гитхаб - https:/github.com/ShusevA/ARI-AJAX-Application 
      Требоватие к этой работе https://docs.google.com/document/d/10gLPHDqGNMDSeSQbYfG8RVtXR3XQOrchSBmd50OzJ_s/edit
      С уважением к Вам, за ранее спасибо.

  • Обсуждения

    • Nikker
      Дизайн сайтов, landing page, логотипов, баннеров, шапок | Высокое качество, по хорошей цене

      By Nikker · Posted

      Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ    
    • Nikker
      Брендовый дизайн в социальных сетях

      By Nikker · Posted

      Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com   Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ   Портфолио https://www.behance.net/d4d4186e
    • Mondeus
      Вёрстка футера на движке Xenforo

      By Mondeus · Posted

      Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение.  .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } }  
    • torsar
      Примеры верстки

      By torsar · Posted

      Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Да, подходит. Спасибо.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept