| |
|
|
| | есть одна ссылка вверху страницы, другая внизу (href у обоих одинаковый).
Как сделать так чтобы при наведении мышки на одну из ссылок - загорались обе ссылки. | |
| |
|
|
| |
|
|
| |
для: f0ggY
(26.04.2007 в 22:31)
| | | Можно так:
<html>
<head>
<SCRIPT><!--
function fover()
{ a1.style.color='#ff0000';
a2.style.color='#ff0000';
}
function fout()
{ a1.style.color='#0000ff';
a2.style.color='#0000ff';
}
//--></SCRIPT>
</head>
<body>
<a id="link1" href="#" onmouseover="fover()" onmouseout="fout()">Ссылка 1</a><br><br>
<a id="link2" href="#" onmouseover="fover()" onmouseout="fout()">Ссылка 2</a>
</body>
<SCRIPT><!--
var a1=document.getElementById('link1');
var a2=document.getElementById('link2');
fout();
//--></SCRIPT>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: yuk
(26.04.2007 в 23:20)
| | | Спасибо! а попроще никак нельзя? а то ссылок таких много, код слишком большой получается. итак страница не маленькая... | |
| |
|
|
| |
|
|
| |
для: f0ggY
(28.04.2007 в 19:49)
| | | Можно немногим упростить предложенный yuk-ом правильный вариант переопределения стилей js скриптом, но во всех случаях придется ставить имена у каждой пары (тройки и т.д. якорей) и вызовы функции переопределения стилей js:
<html>
<head>
<script type="text/javascript">
<!--
function changeanchor(obj,flag)
{
if(flag==0){
for(var i=0;i<document.getElementsByName(obj).length;i++)
document.getElementsByName(obj)[i].style.color='#0ff';
}
else if(flag==1){
for(var i=0;i<document.getElementsByName(obj).length;i++)
document.getElementsByName(obj)[i].style.color='#f00';
}
}
// -->
</script>
<style>
.anchor
{color: #f00;}
</style>
</head>
<body>
<a class="anchor" name="firstanchor" onmouseover="changeanchor(this.name,0);" onmouseout="changeanchor(this.name,1);" href="#">First anchor</a>
<a class="anchor" name="twoanchor" onmouseover="changeanchor(this.name,0);" onmouseout="changeanchor(this.name,1);" href="#">Two anchor</a>
<a class="anchor" name="treeanchor" onmouseover="changeanchor(this.name,0);" onmouseout="changeanchor(this.name,1);" href="#">Tree anchor</a>
<div style="height: 400px;"></div>
<a class="anchor" name="firstanchor" onmouseover="changeanchor(this.name,0);" onmouseout="changeanchor(this.name,1);" href="#">First anchor</a>
<a class="anchor" name="twoanchor" onmouseover="changeanchor(this.name,0);" onmouseout="changeanchor(this.name,1);" href="#">Two anchor</a>
<a class="anchor" name="treeanchor" onmouseover="changeanchor(this.name,0);" onmouseout="changeanchor(this.name,1);" href="#">Tree anchor</a>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: ilyaILF
(28.04.2007 в 21:06)
| | | Проще - перехватывать события на документе и искать источник srcElement, или пробежаться скриптом по ссылкам и проделать addEventListener() / attachEvent(). Кроме того, для других браузеров там и там разные названия. В общем, про это можно целую статью написать, а в 2 словах не получится.
Пример первого подхода:
<style>.linkmouseout{color:#00c}.linkmouseover{color:#c0c}</style>
<script>
(d=document).onmouseout=document.onmouseover=function(ev){
ev=ev||event;
if((linkObj=d.all?ev.srcElement:ev.target).tagName!='A')return; //интересуют только ссылки
if(linkObj.name==null)return; //и только с именем в атрибуте
classPaint='link'+ev.type; //класс для перекраски
aLinks=d.getElementsByName(linkObj.name);
for(i=0;i<aLinks.length;i++)aLinks[i].className=classPaint; //перекраска
}
repaint=function(ev){}
</script>
<pre>
<a href=#>simple link - 123456</a>
123456
Тип 1 - <a name=n1 href=#>123456</a>
Тип 2 - **************** <a name=n2 href=#>123456</a>
123456
123456
Тип 2 - **************** <a name=n2 href=#>123456</a>
123456
123456
Тип 1 - <a name=n1 href=#>123456</a>
Тип 1 - <a name=n1 href=#>123456</a>
12345
|
Смотреть работу здесь: (далее просто называть пары или более ссылок одинаковым именем; не знаю, как поведут себя якоря - тоже окрашиваться будут, поэтому надо дописать, что если href нет, тоже выходить из функции) | |
| |
|
|
| |
|
|
| |
для: 12345
(28.04.2007 в 21:36)
| | | Всем спасиб, выбрал подходящее | |
| |
|
|
