https://github.com/samsono/Easy-Responsive-Tabs-to-Accordion
jeigu reikia tik accordion
html open tags
| <div class="accordion catintro "> | |
| <div class="accordion-section"> | |
| <a class="accordion-section-title" href="#galerija-45">Šilkografija</a> | |
| <div id="galerija-45" class="accordion-section-content"> |
| <script type="text/javascript"> | |
| jQuery(document).ready(function() { | |
| function close_accordion_section() { | |
| jQuery('.accordion .accordion-section-title').removeClass('active'); | |
| jQuery('.accordion .accordion-section-content').slideUp(300).removeClass('open'); | |
| } | |
| jQuery('.accordion-section-title').click(function(e) { | |
| // Grab current anchor value | |
| var currentAttrValue = jQuery(this).attr('href'); | |
| if(jQuery(e.target).is('.active')) { | |
| close_accordion_section(); | |
| }else { | |
| close_accordion_section(); | |
| // Add active class to section title | |
| jQuery(this).addClass('active'); | |
| // Open up the hidden content panel | |
| jQuery('.accordion ' + currentAttrValue).slideDown(300).addClass('open'); | |
| } | |
| e.preventDefault(); | |
| }); | |
| //pagal hash atidarome galerija, jei ne - atidarome pirmaja | |
| if (window.location.hash) { | |
| $('a.accordion-section-title[href="'+window.location.hash+'"]').trigger('click'); | |
| } else { | |
| $('a.accordion-section-title[href="'+ $('a.accordion-section-title:first').attr('href') +'"]').trigger('click'); | |
| } | |
| }); | |
| </script> | |
| <style> | |
| /*------------------------------------*\ | |
| -------- DEMO Code: accordion | |
| \*------------------------------------*/ | |
| /*----- Accordion -----*/ | |
| .accordion, .accordion * { | |
| -webkit-box-sizing:border-box; | |
| -moz-box-sizing:border-box; | |
| box-sizing:border-box; | |
| } | |
| .accordion { | |
| overflow:hidden; | |
| box-shadow:0px 1px 3px rgba(0,0,0,0.25); | |
| border-radius:3px; | |
| background:#f7f7f7; | |
| } | |
| /*----- Section Titles -----*/ | |
| .accordion-section-title { | |
| width:100%; | |
| padding:15px; | |
| display:inline-block; | |
| border-bottom:1px solid #1a1a1a; | |
| background:#116b74; | |
| transition:all linear 0.15s; | |
| /* Type */ | |
| font-size:1.200em; | |
| text-shadow:0px 1px 0px #1a1a1a; | |
| color:#fff; | |
| } | |
| .accordion-section-title.active, .accordion-section-title:hover { | |
| background:#01292d; | |
| /* Type */ | |
| text-decoration:none; | |
| } | |
| .accordion-section:last-child .accordion-section-title { | |
| border-bottom:none; | |
| } | |
| /*----- Section Content -----*/ | |
| .accordion-section-content { | |
| padding:15px; | |
| display:none; | |
| } | |
| </style> |
Komentarų nėra:
Rašyti komentarą