Хаки и Скрипты Next Generation CMS
irbees2008 irbees2008 Опубликовано - 1 - октября Текст и ссылки
3964 - 0
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки
  • Демо:

Всем здорово. Вот наткнулся у себя в архивах на интересный эффект,может кому пригодится, ну сам эффект заключается в том ,при наведении на ссылку или клику, буквы будут переливаться цветами радуги.
Итак, приступим
В секцию head добавляем вот такой код:

Код:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script>
(function($)
{
$.fn.jMagnify = function(o) {

o = $.extend({
centralEffect: {'font-size': '200%'},
lat1Effect: {'font-size': '180%'},
lat2Effect: {'font-size': '150%'},
lat3Effect: {'font-size': '120%'},
resetEffect: {'font-size': '100%'}
}, o);

return this.each(function(i) {
var el = $(this);
var uuid = (el.attr('id') || el.attr('class') || 'internalName') + '_jMagnify';
var myText = "";
var aStr = el.text().split("");

for (var len in aStr)
myText += "<span class='" + uuid + "'>" + aStr[len] + "</span>";
el.html(myText);
$('.' + uuid).hover(function(){
$(this).css(o.centralEffect)
.next().css(o.lat1Effect)
.next().css(o.lat2Effect)
.next().css(o.lat3Effect);
$(this).prev().css(o.lat1Effect)
.prev().css(o.lat2Effect)
.prev().css(o.lat3Effect);
},
function() {
$(this).css(o.resetEffect)
.next().css(o.resetEffect)
.next().css(o.resetEffect)
.next().css(o.resetEffect);
$(this).prev().css(o.resetEffect)
.prev().css(o.resetEffect)
.prev().css(o.resetEffect);
});
});
};
})(jQuery);

<!-- Радужный эффект -->
$().ready(function() {
$('.second').jMagnify({
centralEffect: {'color': 'yellow'},
lat1Effect: {'color': 'orange'},
lat2Effect: {'color': 'red'},
lat3Effect: {'color': 'magenta'},
resetEffect: {'color': 'black'}
});
});
</script>
]

И вот такой в HTML:

Всем привет

Код:
<p class='second' style='font-size: 22pt;'>Всем привет </p>
Или вот так (для ссылки):
Всем привет
Код:
<a href="https://ngcmshak.ru" class="second">Всем привет</a>
Или так для заголовка:

Всем привет

Код:
<h2 class='second'>Всем привет</h2>

Можешь почитать и вот эту статейку "Красивый слайдер на флеш анимации"

Опрос

Ваше мнение

Какие темы вам интереснее?
Результаты

Последние комментарии

Обновленное

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 4737 дней
  • Новостей: 604
  • Комменты: 257
  • Зарегистрированно : 704
  • Онлайн всего: [18]
  • Гости: [18]
  • Были сегодня : [3] Яндекс, Google, irbees2008
  • SQL запросов: 32
  • Генерация страницы: 0.748сек
  • Потребление памяти: 5.600 Mb 
  •   Яндекс.Метрика