Объявление
Уважаемые читатели, друзья, подписчики. В связи с участившимся и, порядком надоевшим спамом в комментариях от всяких анонимах(будь они не ладны), я вынуждена включить модерацию комментариев на некоторое время. Очень надеюсь на ваше понимание.

Радужные ссылки для блога

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

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

Чтобы сделать себе такие, зайдите во вкладку ТЕМА и нажмите изменить HTML. Сейчас найдите закрывающийся тег </head>/ . Обычно он недалеко от начала. И сразу над ним установите следующий код.

<script type='text/javascript'>
//<![CDATA[
function makeColor(){if(elmS==0){elmR=elmV;elmG=elmV;elmB=elmV}else{t1=elmV;t2=(255-elmS)*elmV/255;t3=elmH%60;t3=(t1-t2)*t3/60;if(elmH<60){elmR=t1;elmB=t2;elmG=t2+t3}else if(elmH<120){elmG=t1;elmB=t2;elmR=t1-t3}else if(elmH<180){elmG=t1;elmR=t2;elmB=t2+t3}else if(elmH<240){elmB=t1;elmR=t2;elmG=t1-t3}else if(elmH<300){elmB=t1;elmG=t2;elmR=t2+t3}else if(elmH<360){elmR=t1;elmG=t2;elmB=t1-t3}else{elmR=0;elmG=0;elmB=0}}elmR=Math.floor(elmR).toString(16);elmG=Math.floor(elmG).toString(16);elmB=Math.floor(elmB).toString(16);if(elmR.length==1)elmR="0"+elmR;if(elmG.length==1)elmG="0"+elmG;if(elmB.length==1)elmB="0"+elmB;elmH=elmH+rate;if(elmH>=360)elmH=0;return"#"+elmR+elmG+elmB}function ChangeColor(){objActive.style.color=makeColor()}function Mozilla_stopRainbowAnchor(a){if(act){if(objActive.nodeName=="A"){objActive.style.color=clrOrg;clearInterval(TimerID);act=0}}}function Mozilla_doRainbowAnchor(a){if(act==0){obj=a.target;while(obj.nodeName!="A"&&obj.nodeName!="BODY"){obj=obj.parentNode;if(obj.nodeName=="A"||obj.nodeName=="BODY")break}if(obj.nodeName=="A"&&obj.href!=""){objActive=obj;act=1;clrOrg=obj.style.color;TimerID=setInterval("ChangeColor()",100)}}}function stopRainbowAnchor(){if(act){if(objActive.tagName=="A"){objActive.style.color=clrOrg;clearInterval(TimerID);act=0}}}function doRainbowAnchor(){if(act==0){var a=event.srcElement;while(a.tagName!="A"&&a.tagName!="BODY"){a=a.parentElement;if(a.tagName=="A"||a.tagName=="BODY")break}if(a.tagName=="A"&&a.href!=""){objActive=a;act=1;clrOrg=objActive.style.color;TimerID=setInterval("ChangeColor()",100)}}}function stopRainbow(){if(act){objActive.style.color=clrOrg;clearInterval(TimerID);act=0}}function doRainbow(a){if(act==0){act=1;if(a)objActive=a;else objActive=event.srcElement;clrOrg=objActive.style.color;TimerID=setInterval("ChangeColor()",100)}}var rate=20;if(document.getElementById)window.onerror=new Function("return true");var objActive;var act=0;var elmH=0;var elmS=128;var elmV=255;var clrOrg;var TimerID;if(document.all){document.onmouseover=doRainbowAnchor;document.onmouseout=stopRainbowAnchor}else if(document.getElementById){document.captureEvents(Event.MOUSEOVER|Event.MOUSEOUT);document.onmouseover=Mozilla_doRainbowAnchor;document.onmouseout=Mozilla_stopRainbowAnchor}
//]]>
</script>


Всё. Не забудьте сохранить. Просмотрите блог и порадуйтесь результату.

Не отнимаю больше вашего драгоценного времени. Увидимся. 

здесь можно оформить подписку на новые шпаргалки

Введите Ваш email


9 комментариев:

  1. Вика, а где можно посмотреть пример такой ссылки?

    ОтветитьУдалить
    Ответы
    1. Леонид Николаевич. Вот в этом предложении вверху в статье - Посмотрите на этом тестовом блоге- нажмите на слово ЭТОМ. И там наведите курсор на любое название статьи или на ссылки в гаджете популярные сообщения. Надо мне видимо поярче свои ссылки оформить.

      Удалить
  2. Благодаря за информацията, Вика. Ще пиша на български език, защото руският език е много красив, но много труден език. Веднага приложих този код в блога си и хипервръзките ви станаха пъстри и весели, така както е пъстър и блогът ми www.thelibrary-bg.com. Много ти благодаря. Предлагаш винаги много интересни решения.

    ОтветитьУдалить
    Ответы
    1. Ой, Пепа, правда красиво получилось в Вашем блоге библиотеки. Спасибо и Вам что заглядываете.

      Удалить
  3. Красивые ссылочки! Переливаются!

    ОтветитьУдалить
    Ответы
    1. да, Ирина. Можно к Новому Году оформить, а потом убрать.

      Удалить
  4. Вика,привет.А для картинок же тоже есть такие эффекты?

    ОтветитьУдалить
  5. Привет, можно сделать по этому варианту http://www.shpargalochki.ru/2015/09/kak-sdelat-migajushhij-tekst-na-CSS.html, только в теги а вставить путь к картинке.
    Можно мигающую сделать http://www.shpargalochki.ru/2019/08/tekst-i-migayushie-izobrazheniya-s-pomoshyu-css-ili-javascript.html.

    ОтветитьУдалить

ВСЕГДА РАДА УСЛЫШАТЬ ВАШЕ МНЕНИЕ!
Ели у вас возникла необходимость опубликовать код в комментарии, то воспользуйтесь encoder HTML