Databases
StackOverflow2013
Postsdbo
POAnchor link not working inside alternative tabs in accordion effect
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAnchor link not working inside alternative tabs in accordion effect
    text
    copied!<p>I have this tabs hiding each other with css and javascript:</p> <pre><code> &lt;div class="accordionContent"&gt; &lt;div class="menusfondo"&gt; &lt;div class="content"&gt; &lt;ul class="tabs2"&gt; &lt;li&gt;&lt;a href="#scheda4" id="uno"&gt;INTRODUZIONE&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#scheda5"&gt;FILOSOFIA&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#scheda6"&gt;CASI DI SUCCESSO&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#scheda7"&gt;ULTIME INNOVAZIONI&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#scheda8"&gt;CONTATTI&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;div class="contenitore_tab2"&gt; &lt;div id="scheda4" class="contenuto_tab2"&gt; &lt;h1&gt;title&lt;/h1&gt; &lt;h2&gt;title2&lt;/h2&gt; &lt;p&gt;content &lt;a href="#scheda5"&gt;link scheda 5&lt;/a&gt;. content&lt;/p&gt; &lt;/div&gt; &lt;div id="scheda5" class="contenuto_tab2"&gt; &lt;h1&gt; title&lt;/h1&gt; &lt;h2&gt; title2&lt;/h2&gt; &lt;p&gt;content&lt;/p&gt; &lt;/div&gt; &lt;div id="scheda6" class="contenuto_tab2"&gt; &lt;h1&gt;title&lt;/h1&gt; &lt;h2&gt;title2 &lt;/h2&gt; &lt;p&gt;content&lt;/p&gt;&lt;/div&gt; &lt;div id="scheda7" class="contenuto_tab2"&gt; &lt;h1&gt;title&lt;/h1&gt; &lt;h2&gt;title2&lt;/h2&gt; &lt;p&gt;content&lt;/p&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="wrapper2"&gt; &lt;div class="accordionButton uno"&gt;&lt;div class="content"&gt; &lt;h1&gt;title&lt;/h1&gt; &lt;/div&gt; &lt;div id="hidden"&gt;&lt;/div&gt;&lt;/div&gt; &lt;div class="accordionContent "&gt; &lt;div class="menusfondo"&gt; &lt;div class="content"&gt; &lt;ul class="tabs"&gt; &lt;li&gt;&lt;a href="#scheda1"&gt;INTRODUZIONE&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#scheda2"&gt;FILOSOFIA&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#scheda3"&gt;NEGOZIO ONLINE&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a onclick="window.open('http://www.eurotesterpen.com/contact','_blank');"&gt;CONTATTI&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;div class="contenitore_tab"&gt; &lt;div id="scheda1" class="contenuto_tab"&gt; </code></pre> <p>The anchor which doesn't work is inside the div "scheda4". It is exactly like the links in the menu for each tabs but i'm not sure if i should chain it to the javascript to make it work. The javascript is:</p> <pre><code> $(document).ready(function() { $(".contenuto_tab2").hide(); //Nascondo tutti i contenuti $("ul.tabs2 li:first").addClass("active").show(); //Attivo il primo tab $(".contenuto_tab2:first").show(); //Mostro il primo contenuto (contenuto del primo tab) $("ul.tabs2 li").click(function() { $("ul.tabs2 li").removeClass("active"); //Rimuovo tuttle le classi "active" $(this).addClass("active"); //Attivo il tab selezionato $(".contenuto_tab2").hide(); //Nascondo tutti i contenuti var tabAttivo = $(this).find("a").attr("href"); //Prendo il valore dell'attributo href del tab per attivare il realtivo contenuto $(tabAttivo).fadeIn(); //Faccio un Fade in per mostrare il contenuto dell'ID appena trovato return false; }); </code></pre> <p>});</p> <p>Why doesn't it show the right tab (scheda 5) when i click on it? The effect of the click is none, the page remains the same. Please can you give me some help?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload