Как сделать текстовую ссылку анимированной???

Главные вкладки

Аватар пользователя xploid xploid 8 июня 2012 в 21:19

Привет комьюнити!!!
В очередной раз сталкиваюсь с проблемой кодинга... инфы на гугле не нашел, может мало копал, а может мало кто сталкивался с такой проблемой как у меня...
И так...

В теме оформления page.tpl.php есть такие строки:

<?php
        if (!empty($site_name)) { echo '<h1 class="art-Logo-name"><a href="'.check_url($base_path).'">'.$site_name.'</a></h1>'; }
        if (!empty($site_slogan)) { echo '<div class="art-Logo-text">'.$site_slogan.'</div>'; }
    ?>

Необходимо первую строку изменить так чтобы выводился текст-ссылка.

Понятно что можно вывести так:

<?php
        if (!empty($site_name)) { echo '<h1 class="art-Logo-name"><a href="drupal.ru">СЧАСТЬЕ - ЗДЕСЬ</a></h1>'; }
        if (!empty($site_slogan)) { echo '<div class="art-Logo-text">'.$site_slogan.'</div>'; }
    ?>

Но нужно вывести текст который был бы либо анимированным, либо имел статичный перелив либо какой другой настраиваемый эффект, т.к. текст-ссылка от фона плохо отличима.

Попытка сделать это напрямую, так:

<?php
        if (!empty($site_name)) { echo '<h1 class="art-Logo-name"><a href="drupal.ru"><script language="JavaScript1.2">

var message="СЧАСТЬЕ - ЗДЕСЬ"
var neonbasecolor="#285583"
var neontextcolor="#6C9AC8"
var neontextcolor2="#B2CCE7"
var flashspeed=100 // speed of flashing in milliseconds
var flashingletters=3 // number of letters flashing in neontextcolor
var flashingletters2=1 // number of letters flashing in neontextcolor2 (0 to disable)
var flashpause=0 // the pause between flash-cycles in milliseconds

///No need to edit below this line/////

var n=0
if (document.all||document.getElementById){
document.write('

<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('
<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('
</font>')
}
else
document.write(message)

function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}

function neon(){

//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
crossref(m).style.color=neonbasecolor
}

//cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor

if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor

if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return
}
}

function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()

</script></a></h1>'

; }
        if (!empty($site_slogan)) { echo '<div class="art-Logo-text">'.$site_slogan.'</div>'; }
    ?>

не увенчалась успехом.

Попытки манипуляции с кодом ява-скриптов радужных эффектов или каких-либо других успехов не принесла.

Два дня бьюсь с явой и друпалом... Кто-нибудь из знающих может помочь в решении проблемы???

Комментарии

Аватар пользователя xploid xploid 8 июня 2012 в 23:36

Хотелось бы увидеть оба варианта, чтобы оценить как это будет смотреться на странице... ну и реализацию - как это будет выглядеть.