Zakładki - atrybut w CSS, aby "przykryć" nieaktywne zakładki

Question

Mam problem z zakładkami na stronie produktu w sklepie http://chanelka.pl/pl/p/Biala-bluzka-nr-333/48 Sklep jest na shoperze. Tak jak udało mi się stworzyć zakładki i ich wygląd i funkcjonowanie jest okej, tak po 1 ładowaniu strony widać treść wszystkich zakładek, a dopiero po kliknięciu w którąś z nich pojawia się właściwa treść. Może ktoś z Was zna jakiś sposób, aby widoczna była tylko zakładka aktywna, a ukryte te nieaktywne? Z góry dziękuje i czekam na pomysły :)

Answer 1

Po prostu dla tab2 - 7 ustaw display: none;

Comments

No tak - proste :) Dzięki za podpowiedź. Jak możesz zerknij proszę czy teraz wyświetlają się ok te zakładki? :) (chcę mieć rozeznanie na kilku komputerach :)

---

Tak. Jest dobrze.

---

Świetnie działa tylko problem występuje np. w takim produkcie, gdzie dodatkowo są rozmiary do wybrania - http://chanelka.pl/pl/p/Michasia-3-Test/56

Po kliknięciu w daną zakładkę niezmienia się opis i wyrzuca mi tylko link do #tab

Tabelki wtedy nie działają. Czy to jakiś konflikt javascript? Nie wiem jak to rozwiązać

Answer 2

1)Daj może kod..

2)Sprecyzuj o jakie zakładki chodzi bo ja zadnych nie widze.

Comments

{if strlen(trim($product->translation->description)) || count($product->files)}
• {translate key="Description"}
{/if} {if count($attrs)}
• {translate key="Technical data"}
{/if} {if count($gallery) > 1 && 1 == (int) $skin_settings->productdetails->miniaturesposition}
• {translate key="Product gallery"}
{/if}
• Dostawa
• Zwroty
{if count($related_products) && 1 == $skin_settings->productdetails->related}
• {translate key="Related products"}
{/if} {if false !== $product_comments && 1 == $skin_settings->productdetails->comments}
• {translate key="Product reviews"} ({$product_comments|count})
{/if}

---

i CSS #xnine-tabs { margin-top: 12px; } .tabs-menu { height: 46px; float: left; clear: both; } .tabs-menu li { height: 30px; line-height: 30px; float: left; padding: 8px 0px; } .tabs-menu li.current { position: relative; background-color: #FFF; border-bottom: 1px solid #FFF; z-index: 5; border-top: 1px solid #D4D4D1; border-right: 1px solid #D4D4D1; border-left: 1px solid #D4D4D1;} .tabs-menu li a { color: #000; text-decoration: none; font: 300 19px/100% Oswald; text-transform: none; letter-spacing: 0px; padding: 5px 16px; display: block; } .tabs-menu .current a { color: #333; font: 400 17px/21px Oswald; } .tab { border: 1px solid #d4d4d1; background-color: #fff; float: left; margin-bottom: 20px; width: 100%; } .tab-content { width: auto; padding: 20px; display: block; } .tab-content p { margin-bottom: 15px; font: 400 13px/160% 'Open Sans'; } #tab-1 { display: block; } .fb_buttons { margin-top: 1.25em !important; }

---

Chodzi mi o te zakładki - opis - dostawa, wymiary itd.