mouseover не распространяется на два блока с одни id
 

Ребят помогите плиз голову уже сломал. Я никогда не писал на java.

Есть такой скрипт:

$(document).ready(function() {
        
            //When page loads...
            $(".tab_content").hide(); //Hide all content
            $(".tab_content:first").show(); //Show first tab content
        
            //On MouseOver Event
            $("ul.main_tabs li").mouseover(function() {
        		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
                $(".tab_content").hide(); //Hide all tab content
                $(activeTab).fadeIn(0); //Fade in the active ID content
                return false;
            });

        
        });

и есть такой Html:

<div id="tab1" class="tab_content">
   	<img src="image1" border="0" />
</div>
<div id="tab2" class="tab_content">
   	<img src="image2" border="0"  />
</div>
<div id="tab3" class="tab_content">
	<img src="image3" border="0" alt="" title=""  />
</div>
<ul class="main_tabs">
    <li class="main_news_section1">
        <a href="#tab1">LINK_TEXT</a>
        <div id="tab1" class="tab_content">
            <span>DATE</span><br>
            TEXT
        </div>
    </li>
    <li class="main_news_section2">
        <a href="#tab2">LINK_TEXT</a>
        <div id="tab2" class="tab_content">
            <span>DATE</span><br>
            TEXT
        </div>
    </li>
    <li class="main_news_section3">
        <a href="#tab3">LINK_TEXT</a>
        <div id="tab3" class="tab_content">
            <span>DATE</span><br>
            TEXT
        </div>
    </li>
</ul>

Так вот при наведении на пункт <a href="#tab3"> никак не хочет открываться один из дивов с id=tab3. То есть мне надо чтобы открывались оба присутствующих дива с таким id. А у меня сейчас если один из блоков убрать то все работает прекрасно, а вот чтоб два блока реагировали на Mouseover никак

Идентификаторы должны быть уникальными в пределах документа.

Как мне поступить ?

Либо таки сделать ИД уникальными в пределах документа... Либо вообще убрать элемент с таким же ИД...

Сделаю я уникальные id, но как мне сделать чтобы при наведении допустим на a href="#tab1" показывались два дива ?

Как вариант, засунуть их в третий и скрывать/показывать его... Ведь как показать/скрыть один див ты, я так понял, вкурсе... ;)

:yes: но все равно не могу понять как привязать одну ссылку к двум дивам с разными id и чтобы они реагировали на mouseover ссылки :(

Экий ты неугомон... :lol:
Таки повтори команды в функции для дива с другим ИД и будет тебе счастие.

:) сорри за неугомон :) я ж говорю не знаком с java совсем.

Где тут привязка к id то

var activeTab = $(this).find("a").attr("href");

хоть убейте ребят не вижу :)

Таки это не Ява...
Получай!
Где новый тестовый пример?

Я понял тебя про третий див

<ul class="main_tabs">
    <li class="main_news_section1">
        <a href="#tab1">LINK_TEXT</a>
        <div id="tab1" class="tab_content">
            <span>DATE</span><br>
            TEXT
        </div>
    </li>
    <li class="main_news_section2">
        <a href="#tab2">LINK_TEXT</a>
        <div id="tab2" class="tab_content">
            <span>DATE</span><br>
            TEXT
        </div>
    </li>
    <li class="main_news_section3">
        <a href="#tab3">LINK_TEXT</a>
        <div id="tab3" class="tab_content">
            <span>DATE</span><br>
            TEXT
        </div>
    </li>
</ul>

А внутри дивов с уникальными id выводим уже сколь хочешь дивов. Это понятно на наведение мыши работает один соответсвующий див внутри которого еще сколь угодно блоков.

Так не пойдет мне надо имено два раздельных дива показать независимых вообще (не один в другом и так далее), посмотри Html первый.

$(document).ready(function() {
    $(".tab_content").hide(); 
    $(".tab_content:first").show();
        

    $("ul.main_tabs li").mouseover(function() {
        	var activeTab = $(this).find("a").attr("href"); 
            $(".tab_content").hide();
            $(activeTab).fadeIn(0);
            return false;
    });

        
});

в этом коде строка var activeTab = $(this).find("a").attr("href"); задает в переменную activeTab значение href ссылки внутри ul.main_tabs li ? я же правильно понимаю ?

Да.
Там и хранят ИД нужного элемента. Но у тебя тех же id="tab3" как минимум 2!

<div id="tab3" class="tab_content"> 
    <img src="image3" border="0" alt="" title=""  /> 
</div>

и

<div id="tab3" class="tab_content"> 
   <span>DATE</span><br> 
   TEXT 
</div>

Хорошо пусть будут последние блоки tab3 и tab6 (то есть всего шесть блоков, три пары), тогда как мне сделать открытие одновременно обоих блоков при наведении на ссылку <a href="#tab3">LINK_TEXT</a> ? :) может я неправильно как то рассказываю или это нереальная задача :help:

Если ты хочешь скрывать именно эти элементы при таком "раскладе" скрипта - такие ИД будут не удачным сочетанием... :no:
Более лучший способ - tab3 и tab3_1. Или нечто в таком же духе... Намёк понятен?

я хочу открывать эти элементы
:blink: какие варианты другого расклада?
Понятен, сделал у первых трех блоков ИД tab1, tab2, tab3 у следующих tab1_1, tab2_2, tab3_3 получилось что при загрузке страницы показан блок tab1, при наведении на ссылку с ИД tab1 появляется блок tab1_1 а tab1 скрывается и больше не появлется при переходах между ссылками. Получается что блоки tab2_2 и tab3_3 вообще не цепляются к ссылкам с ИД tab2 и tab3

Чувствую что скрипт надо переписать где то. но не могу сообразить как

Да их валом! :)
Ты не правильно понял мой намёк про ИД... :(
ИД "вторых" элементов должно быть составны по следующему правилу

<ИД_первого_элемента><некая_приставка,_одинаковая_у_всех_участников>

Ты же "приставку" сделал у всех разную... :-E

В принципе все верно с ид такой код не прокатит.

помогли:

$(document).ready(function() {
        
            $(".tab_content").hide();
            $(".tab_content:first").show();
        
            $("ul.main_tabs li").mouseover(function() {
        		var activeTab = $(this).find("a").attr("href").substr(1);
                $(".tab_content").hide();
                $("."+activeTab).fadeIn(0);
                return false;
            });

        });

и дивы у меня получаются с классом tab_content tab1, tab_content tab2, tab_content tab3 все шесть :)

dolphin_al, с классами ты явно перестарался... :) Закончить таки с ИД было бы посподручнее.

Да время поджимает уже как сделал так сделал :) все равно спасибо за помощь и терпение :)