Появилась просьба от одного из пользователей на форуме, которая завела меня в глубокую рефлексию:
У меня маленькая просьба - впихайте в изображения, которые вместо главной навигации, тег с пояснением, потому что с телефона можно долго тыкать наугад, пока найдкшь нужное
Есть ли возможность видоизменить приведённый ниже код, чтобы картинки в навигации отображались ссылками, в случае если они не могут загрузиться иначе? Или же добавить при наведении курсора "всплывающее окно с подсказкой" (что-то вроде alt="..." или title="..."; которая не факт, что спасёт данного пользователя на телефоне). Или же сделать какой-нибудь overlay картинки поверх текста? В общем любое разумное решение.
Использованный код:
<!------------------ Замена ссылок навигации форума картинками ---------------------->
<script>
<!--
indexof="<img src='http://savepic.org/3545740.png' />"
str = document.getElementById("navindex").innerHTML
pos = str.indexOf("Форум")
document.getElementById("navindex").innerHTML=str.substring(0,pos)+indexof+str.substring(pos+5,str.length-1)
-->
</script>
<script>
<!--
userof="<img src='http://savepic.ru/4595652.png' />"
str = document.getElementById("navuserlist").innerHTML
if( (pos=str.indexOf("Участники")) != -1 )
document.getElementById("navuserlist").innerHTML=str.substring(0,pos)+userof+str.substring(pos+9,str.length-1)
-->
</script>
<script>
<!--
findof="<img src='http://savepic.org/3603087.png' />"
str = document.getElementById("navsearch").innerHTML
pos = str.indexOf("Поиск")
document.getElementById("navsearch").innerHTML=str.substring(0,pos)+findof+str.substring(pos+5,str.length-1)
-->
</script>
<script>
<!--
faseof="<img src='http://savepic.net/3804460.png' />"
str = document.getElementById("navprofile").innerHTML
pos = str.indexOf("Профиль")
document.getElementById("navprofile").innerHTML=str.substring(0,pos)+faseof+str.substring(pos+14,str.length-1)
-->
</script>
<script>
<!--
pismaof="<img src='http://savepic.ru/4651975.png' />"
str = document.getElementById("navpm").innerHTML
pos = str.indexOf("Сообщения")
document.getElementById("navpm").innerHTML=str.substring(0,pos)+pismaof+str.substring(pos+9,str.length-1)
-->
</script>
<script>
<!--
godof="<img src='http://savepic.org/3589775.png' />"
str = document.getElementById("navadmin").innerHTML
pos = str.indexOf("Администрирование")
document.getElementById("navadmin").innerHTML=str.substring(0,pos)+godof+str.substring(pos+17,str.length-1)
-->
</script>
<script>
<!--
valiof="<img src='http://savepic.net/3859759.png' />"
str = document.getElementById("navlogout").innerHTML
pos = str.indexOf("Выход")
document.getElementById("navlogout").innerHTML=str.substring(0,pos)+valiof+str.substring(pos+5,str.length-1)
-->
</script>
<script>
<!--
vxodiof="<img src='http://savepic.ru/4640711.png' />"
str = document.getElementById("navlogin").innerHTML
pos = str.indexOf("Войти")
document.getElementById("navlogin").innerHTML=str.substring(0,pos)+vxodiof+str.substring(pos+5,str.length-1)
-->
</script>
<script>
<!--
regof="<img src='http://savepic.net/3850543.png' />"
str = document.getElementById("navregister").innerHTML
pos = str.indexOf("Регистрация")
document.getElementById("navregister").innerHTML=str.substring(0,pos)+regof+str.substring(pos+18,str.length-1)
-->
</script>
<!------------------ Замена второй строчки навигации ---------------------->
<script type="text/javascript">
li=document.getElementsByTagName("li")
f=0
while(li[++f]){
s=li[f].innerHTML
if((p=s.indexOf("Новые сообщения")) != -1) li[f].innerHTML=s.substring(0,p)+"<img src='http://savepic.ru/4608967.png'>"+s.substring(p+15)
else if((p=s.indexOf("Активные темы")) != -1) li[f].innerHTML=s.substring(0,p)+"<img src='http://savepic.net/3812654.png'>"+s.substring(p+13)
else if((p=s.indexOf("Темы без ответов")) != -1) li[f].innerHTML=s.substring(0,p)+"<img src='http://savepic.org/3566222.png'>"+s.substring(p+21)
else if((p=s.indexOf("Мои сообщения")) != -1) li[f].innerHTML=s.substring(0,p)+"<img src='http://savepic.ru/4627398.png'>"+s.substring(p+13)
else if((p=s.indexOf("Подписка")) != -1) li[f].innerHTML=s.substring(0,p)+"<img src='http://savepic.net/3814702.png'>"+s.substring(p+8)
else if((p=s.indexOf("Все прочитано")) != -1) li[f].innerHTML=s.substring(0,p)+"<img src='http://savepic.org/3565198.png'>"+s.substring(p+13)
}
</script>Адрес форума: http://tenner.rusff.ru/
Я знаю, что на некоторых форумах подобные ссылки делаются правильно оформленным текстом, с тенью, нужным цветом и выбранным "фирменным" шрифтом, который поддерживается даже на тех устройствах, где он не предустановлен. Но я так не умею, поэтому даже не прошу научить. Х)
Заранее спасибо за потраченное на прочтение или помощь время.
