Bedava Forum: Yetkinforumun Destek Forumu
Yetkinforum'un destek forumuna hoş geldiniz Smile

Eğer üye iseniz lütfen giriş yapınız, eğer henüz üye değilseniz ve forumdan tam olarak yararlanmak istiyorsanız bizim topluluğumuza katılabilirsiniz

Bu forum gibi ücretsiz forum kurmak
Forumotion support forum

Redirection...
Öğretici Konular Ara...
Sorularınızın Cevaplarını daha kolay bulabilmek için bu arama yerini kullanabilirsiniz !



Görünüm olarak :



Giriş yap

Şifremi unuttum

En son konular
» [Önemli] Türk destek forumunda artık destek verilmeyecektir.
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyPaz 11 Mart 2018 - 23:21 tarafından sevda03

» Çok Acil Bir Yardım Çağrısı
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyÇarş. 20 Ara. 2017 - 19:27 tarafından maxivizyonum

» Domain hakkinda
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyÇarş. 20 Ara. 2017 - 17:50 tarafından maxivizyonum

» Yıllar Önce Açtığım Siteye Ulaşamıyorum Kapatmak İstiyorum.
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyCuma 15 Eyl. 2017 - 23:08 tarafından Percy

» Profil alani
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyPerş. 25 Mayıs 2017 - 1:37 tarafından snappy

» Portal istek
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyCuma 19 Mayıs 2017 - 8:06 tarafından Kertelek

» Kategorilerin üzerine duyuru
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyC.tesi 13 Mayıs 2017 - 16:29 tarafından Maxelle

» SSL Sertifika güvenli değil htpps
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyPerş. 11 Mayıs 2017 - 17:04 tarafından Atiim

» Anasayfa Son Mesajlar Çerceve
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa EmptyPaz 7 Mayıs 2017 - 1:14 tarafından Maxelle

Bedava forum kurmak
Facebook/Twitter
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Twitter    Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Facebook_boton
 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa 85243212   Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Dailym10

Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa

Aşağa gitmek

 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Empty Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa

Mesaj tarafından Paradiz Bir Ptsi 13 Ağus. 2012 - 18:17

 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa 4iekatYetkinForum
Akordeon şekli ana sayfa


Bu paylaşım sayesinde akordeon şekli ana sayfa ekleyebiliceksiniz (ve modeller açık olmadan ekleyebilirsiniz !). Tüm versyonlar için geçeleridir tesekkür ederim




 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa 096151727061. Javascript eklemek

Ilk önce Javascriptleri açmamız gereklidir :
Enable Javascript code management : EVET.


Panneau d'Administration  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Mödüller Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 HTML & Javascript  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Javascript codes management  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa 24ctdgn


  • Yapmanız gerekenler :

    - Başlık : Ana sayfa
    - Placement : In the home page
    - Ve bu kodu ekleyin :

Kod:
$(document).ready(function() {
  $("#accordeon-pa").each(function(){
    $(this).liteAccordion({
      autoPlay:true,
      pauseOnHover:true,
      rounded:true,
      enumerateSlides:true,
      containerWidth: 960,
      containerHeight: 320
    })
  });
});
/*************************************************!
*
*  project:    liteAccordion - a horizontal accordion plugin for jQuery
*  author:    Nicola Hibbert
*  url:        http://nicolahibbert.com/liteaccordion-v2/
*  demo:      http://www.nicolahibbert.com/demo/liteAccordion/
*
*  Version:    2.0.2
*  Copyright:  (c) 2010-2011 Nicola Hibbert
*  Licence:    MIT
*
**************************************************/
(function(b){var a=function(g,l){var i={headerWidth:48,activateOn:"click",firstSlide:1,slideSpeed:800,onTriggerSlide:function(){},onSlideAnimComplete:function(){},autoPlay:false,pauseOnHover:false,cycleSpeed:6000,easing:"swing",theme:"basic",rounded:false,enumerateSlides:false,linkable:false},h=b.extend({},i,l),c=g.children("ol").children("li"),j=c.children(":first-child"),k=c.length,f=h.containerWidth-k*h.headerWidth,e={play:function(m){var n=d.nextSlide(m&&m);if(d.playing){return}d.playing=setInterval(function(){j.eq(n()).trigger("click.liteAccordion")},h.cycleSpeed)},stop:function(){clearInterval(d.playing);d.playing=0},next:function(){e.stop();j.eq(d.currentSlide===k-1?0:d.currentSlide+1).trigger("click.liteAccordion")},prev:function(){e.stop();j.eq(d.currentSlide-1).trigger("click.liteAccordion")},destroy:function(){e.stop();b(window).unbind(".liteAccordion");g.attr("style","").removeClass("accordion basic dark light stitch").removeData("liteAccordion").unbind(".liteAccordion").find("li > :first-child").unbind(".liteAccordion").filter(".selected").removeClass("selected").end().find("b").remove();c.removeClass("slide").children().attr("style","")},debug:function(){return{elem:g,defaults:i,settings:h,methods:e,core:d}}},d={setStyles:function(){g.width(h.containerWidth).height(h.containerHeight).addClass("accordion").addClass(h.rounded&&"rounded").addClass(h.theme);c.addClass("slide").children(":first-child").width(h.containerHeight).height(h.headerWidth).eq(h.firstSlide-1).addClass("selected");j.each(function(m){var p=b(this),o=m*h.headerWidth,n=j.first().next(),q=parseInt(n.css("marginLeft"),10)||parseInt(n.css("marginRight"),10)||0;if(m>=h.firstSlide){o+=f}p.css("left",o).next().width(f-q).css({left:o,paddingLeft:h.headerWidth});h.enumerateSlides&&p.append("<b>"+(m+1)+"</b>")})},bindEvents:function(){if(h.activateOn==="click"){j.bind("click.liteAccordion",d.triggerSlide)}else{if(h.activateOn==="mouseover"){j.bind({"mouseover.liteAccordion":d.triggerSlide,"click.liteAccordion":d.triggerSlide})}}if(h.pauseOnHover&&h.autoPlay){g.bind("mouseover.liteAccordion",function(){d.playing&&e.stop()}).bind("mouseout.liteAccordion",function(){!d.playing&&e.play(d.currentSlide)})}},linkable:function(){var m=(function(){var o=[];c.each(function(){if(b(this).attr("name")){o.push((b(this).attr("name")).toLowerCase())}});return m=o})();var n=function(p){var o;if(p.type==="load"&&!window.location.hash){return}if(p.type==="hashchange"&&d.playing){return}o=b.inArray((window.location.hash.slice(1)).toLowerCase(),m);if(o>-1&&o<m.length){j.eq(o).trigger("click.liteAccordion")}};b(window).bind({"hashchange.liteAccordion":n,"load.liteAccordion":n})},currentSlide:h.firstSlide-1,nextSlide:function(m){var n=m+1||d.currentSlide+1;return function(){return n++%k}},playing:0,animSlideGroup:function(m,o,n){var p=n?":lt("+(m+1)+")":":gt("+m+")";c.filter(p).each(function(){var r=b(this),q=c.index(r);r.children().stop(true).animate({left:(n?0:f)+q*h.headerWidth},h.slideSpeed,h.easing,function(){if(!d.slideAnimCompleteFlag){h.onSlideAnimComplete.call(o);d.slideAnimCompleteFlag=true}})})},slideAnimCompleteFlag:false,triggerSlide:function(p){var o=b(this),m=j.index(o),n=o.next();d.currentSlide=m;d.slideAnimCompleteFlag=false;j.removeClass("selected").filter(o).addClass("selected");if(p.originalEvent&&h.autoPlay){e.stop();e.play(m)}if(h.linkable&&!d.playing){window.location.hash=o.parent().attr("name")}h.onTriggerSlide.call(n);d.animSlideGroup(m,n,true);d.animSlideGroup(m,n)},ieClass:function(){var m=+(b.browser.version).charAt(0);if(m<7){e.destroy()}if(m===7||m===8){c.each(function(n){b(this).addClass("slide-"+n)})}g.addClass("ie ie"+m)},init:function(){if(b.browser.msie){d.ieClass()}d.setStyles();d.bindEvents();if(h.cycleSpeed<h.slideSpeed){h.cycleSpeed=h.slideSpeed}if(h.linkable&&"onhashchange" in window){d.linkable()}h.autoPlay&&e.play()}};d.init();return e};b.fn.liteAccordion=function(e){var d=this,c=d.data("liteAccordion");if(typeof e==="object"||!e){return d.each(function(){var f;if(c){return}f=new a(d,e);d.data("liteAccordion",f)})}else{if(typeof e==="string"&&c[e]){if(e==="debug"){return c[e].call(d)}else{c[e].call(d);return d}}}}})(jQuery);

• "containerWidth: 960" : anasayfa genişligi
• "containerHeight: 320" : anasayfa yüksekligi

Ve gönderin.

 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa 096151727062. HTML kodu

Yönetim paneli  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Afiş asmak  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Anasayfa  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Genel bilgiler  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Anasayfa mesajı

Eklemeniz gereken kod :

Kod:
<div id="accordeon-pa" class="accordion">
    <ol>
        <li>
            <h2><span>Slide 1</span></h2>
            <div>
              <figure>
                <img class="full" src="http://i.imgur.com/SHaqP.jpg" alt="image" />
              </figure>
            </div>
        </li>
        <li>
            <h2><span>Slide 2</span></h2>
            <div>
              <figure>
                <img class="full" src="http://i.imgur.com/v5LuU.jpg" alt="image" />
              </figure>
            </div>
        </li>
        <li>
            <h2><span>Slide 3</span></h2>
            <div>
              <figure>
                <img class="full" src="http://i.imgur.com/VdDge.jpg" alt="image" />
              </figure>
            </div>
        </li>
        <li>
            <h2><span>Slide 4</span></h2>
            <div>
              <figure>
                <img class="full" src="http://i.imgur.com/EwuD0.jpg" alt="image" />
              </figure>
            </div>
        </li>
        <li>
            <h2><span>Slide 5</span></h2>
            <div>
              <figure>
                <img class="full" src="http://i.imgur.com/Wl1P6.jpg" alt="image" />
              </figure>
            </div>
        </li>
    </ol>
</div>

Degistirmeniz gereken yerler :
• "Slide #" : basliklar
• resimi degistirmek için : <img class="full" src="https://i.imgur.com/{...}.jpg" alt="image" /> bu kodu degistirmelisiniz.


 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa 096151727063. CSS kodu

Yönetim paneli  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Afiş asmak  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10 Resimler ve renkler  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10Renkler  Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Arrow10CSS Stylesheet

3 Model :

  • « Normal » :

     Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Aaa10
    Kod:
    @charset 'utf-8';
    /*************************************************!
    *
    *  project:    liteAccordion - a horizontal accordion plugin for jQuery
    *  author:    Nicola Hibbert
    *  url:        http://nicolahibbert.com/liteaccordion-v2/
    *  demo:      http://www.nicolahibbert.com/demo/liteAccordion/
    *
    *  Version:    2.0.2
    *  Copyright:  (c) 2010-2011 Nicola Hibbert
    *  Licence:    MIT
    *
    **************************************************/
    /****************************************** Core */
    .accordion { text-align: left; font: 'Helvetica Neue', Verdana, Arial, sans-serif }
    .accordion > ol { position: relative; overflow: hidden; height: 100%; margin: 0; padding: 0; list-style-type: none }
    .accordion .slide > h2 {
      color: black;
        font-size: 16px; 
      font-weight: normal;
      margin: 0;
      z-index: 100;
      position: absolute;
      top: 0;
      left: 0;
      -webkit-transform: translateX(-100%) rotate(-90deg);
      -webkit-transform-origin: right top;
      -moz-transform: translateX(-100%) rotate(-90deg);
      -moz-transform-origin: right top;
      -o-transform: translateX(-100%) rotate(-90deg);
      -o-transform-origin: right top;
      transform: translateX(-100%) rotate(-90deg);
      transform-origin: right top;
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
    .accordion .slide > h2 span {
        display: block;
        padding-right: 8%;
        text-align: right;
        height: 90%;
        margin-top: 5px;
        -moz-user-select: none;
        -khtml-user-select: none;
        user-select: none;
    }
    .accordion .slide > h2 b {
        display: inline-block;
        position: absolute;
        top: 13%;
        left: 10%;
        text-align: center;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    }
    .accordion .slide > h2:hover { cursor: pointer }
    .accordion .slide > div { height: 100%; position: absolute; top: 0; z-index: 10; overflow: hidden; background: white }
     
    /****************************************** Basic */
    .accordion .slide > h2 { background: #333; color: white; line-height: 225% }
     
    /*************************************** Rounded */
    .rounded, .rounded > ol { -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px }
    .rounded .slide > h2 span { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px }
     
    /******************************************** IE */
    .ie .slide > h2 b { top: 42%; left: 5% }
    .ie9 .slide > h2 { filter: none; -ms-transform: translateX(-100%) rotate(-90deg); -ms-transform-origin: right top }
     
    /******************************************** FA */
    .accordion figure .full { width: 100%; height: 100%; }
    .accordion h2 { border: none; }

    /* centrer l'accordéon */
    .accordion { margin: auto; }
  • « Siyah » :

     Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Bbb10
    Kod:
    @charset 'utf-8';
    /*************************************************!
    *
    *  project:    liteAccordion - a horizontal accordion plugin for jQuery
    *  author:    Nicola Hibbert
    *  url:        http://nicolahibbert.com/liteaccordion-v2/
    *  demo:      http://www.nicolahibbert.com/demo/liteAccordion/
    *
    *  Version:    2.0.2
    *  Copyright:  (c) 2010-2011 Nicola Hibbert
    *  Licence:    MIT
    *
    **************************************************/
    /****************************************** Core */
    .accordion { text-align: left; font: 'Helvetica Neue', Verdana, Arial, sans-serif }
    .accordion > ol { position: relative; overflow: hidden; height: 100%; margin: 0; padding: 0; list-style-type: none }
    .accordion .slide > h2 {
      color: black;
        font-size: 16px;   
      font-weight: normal;
      margin: 0;
      z-index: 100;
      position: absolute;
      top: 0;
      left: 0;
      -webkit-transform: translateX(-100%) rotate(-90deg);
      -webkit-transform-origin: right top;
      -moz-transform: translateX(-100%) rotate(-90deg);
      -moz-transform-origin: right top;
      -o-transform: translateX(-100%) rotate(-90deg);
      -o-transform-origin: right top;
      transform: translateX(-100%) rotate(-90deg);
      transform-origin: right top;
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
    .accordion .slide > h2 span {
        display: block;
        padding-right: 8%;
        text-align: right;
        height: 90%;
        margin-top: 5px;
        -moz-user-select: none;
        -khtml-user-select: none;
        user-select: none;
    }
    .accordion .slide > h2 b {
        display: inline-block;
        position: absolute;
        top: 13%;
        left: 10%;
        text-align: center;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    }
    .accordion .slide > h2:hover { cursor: pointer }
    .accordion .slide > div { height: 100%; position: absolute; top: 0; z-index: 10; overflow: hidden; background: white }
    .accordion noscript p { padding: 10px; margin: 0; background: white }

    /****************************************** Dark */
    .accordion {
        border: 9px solid #353535;
        border-bottom-width: 8px;
        padding: 5px 5px 6px 0;
        background: #030303;
        -webkit-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
        -ms-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
        -o-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
      box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
    }
    .accordion .slide > h2 { background: #030303; text-shadow: 0 -1px 0 #030303; line-height: 265% }
    .accordion .slide > h2 span { background: #353535; color: white }
    .accordion .slide > h2 b { background: #353535; color: #030303; text-shadow: -1px 1px 0 #5b5b5b }
    .accordion .slide > h2.selected span, .accordion .slide > h2.selected span:hover {
        background: #353535;
        background: -moz-linear-gradient(left,  #353535 0%, #555555 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%,#353535), color-stop(100%,#555555));
        background: -webkit-linear-gradient(left,  #353535 0%,#555555 100%);
        background: -o-linear-gradient(left,  #353535 0%,#555555 100%);
        background: -ms-linear-gradient(left,  #353535 0%,#555555 100%);
        background: linear-gradient(left,  #353535 0%,#555555 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#353535', endColorstr='#555555',GradientType=1 );
    }
    .accordion .slide > h2.selected b {
        background: #383838;
        background: -moz-linear-gradient(top,  #3a3a3a 0%, #363636 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3a3a3a), color-stop(100%,#363636));
        background: -webkit-linear-gradient(top,  #3a3a3a 0%,#363636 100%);
        background: -o-linear-gradient(top,  #3a3a3a 0%,#363636 100%);
        background: -ms-linear-gradient(top,  #3a3a3a 0%,#363636 100%);
        background: linear-gradient(top,  #3a3a3a 0%,#363636 100%);
    }
    .accordion .slide > div { background: #030303; margin-left: 5px }

    /*************************************** Rounded */
    .rounded, .rounded > ol { -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px }
    .rounded .slide > h2 span { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px }

    /******************************************** IE */
    .ie .slide > h2 b { top: 42%; left: 5% }
    .ie9 .slide > h2 { filter: none; -ms-transform: translateX(-100%) rotate(-90deg); -ms-transform-origin: right top }
    .ie.accordion .slide > h2 b { top: 44% }
    .ie9.accordion .slide > h2.selected span, .ie9.accordion .slide > h2.selected span:hover { filter: none }

    /******************************************** FA */
    .accordion figure .full { width: 100%; height: 100%; }
    .accordion h2 { border: none; }

    /* centrer l'accordéon */
    .accordion { margin: auto; }
  • « Beyaz » :

     Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa Ccc10
    Kod:
    @charset 'utf-8';
    /*************************************************!
    *
    *  project:    liteAccordion - a horizontal accordion plugin for jQuery
    *  author:    Nicola Hibbert
    *  url:        http://nicolahibbert.com/liteaccordion-v2/
    *  demo:      http://www.nicolahibbert.com/demo/liteAccordion/
    *
    *  Version:    2.0.2
    *  Copyright:  (c) 2010-2011 Nicola Hibbert
    *  Licence:    MIT
    *
    **************************************************/
    /****************************************** Core */
    .accordion { text-align: left; font: 'Helvetica Neue', Verdana, Arial, sans-serif }
    .accordion > ol { position: relative; overflow: hidden; height: 100%; margin: 0; padding: 0; list-style-type: none }
    .accordion .slide > h2 {
      color: black;
        font-size: 16px; 
      font-weight: normal;
      margin: 0;
      z-index: 100;
      position: absolute;
      top: 0;
      left: 0;
      -webkit-transform: translateX(-100%) rotate(-90deg);
      -webkit-transform-origin: right top;
      -moz-transform: translateX(-100%) rotate(-90deg);
      -moz-transform-origin: right top;
      -o-transform: translateX(-100%) rotate(-90deg);
      -o-transform-origin: right top;
      transform: translateX(-100%) rotate(-90deg);
      transform-origin: right top;
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
    .accordion .slide > h2 span {
        display: block;
        padding-right: 8%;
        text-align: right;
        height: 90%;
        margin-top: 5px;
        -moz-user-select: none;
        -khtml-user-select: none;
        user-select: none;
    }
    .accordion .slide > h2 b {
        display: inline-block;
        position: absolute;
        top: 13%;
        left: 10%;
        text-align: center;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    }
    .accordion .slide > h2:hover { cursor: pointer }
    .accordion .slide > div { height: 100%; position: absolute; top: 0; z-index: 10; overflow: hidden; background: white }
    .accordion noscript p { padding: 10px; margin: 0; background: white }
     
    /***************************************** Light */
    .accordion {
        border: 9px solid white;
        border-bottom-width: 8px;
        padding: 5px 5px 6px 0;
        background: #a0a0a0;
        -webkit-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
        -ms-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4); 
        -o-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
      box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
    }
    .accordion .slide > h2 { background: #a0a0a0; text-shadow: 0 -1px 0 white; line-height: 265% }
    .accordion .slide > h2 span {
        background: #fcfcfc;
        background: -moz-linear-gradient(left,  #fcfcfc 0%, #ededed 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fcfcfc), color-stop(100%,#ededed));
        background: -webkit-linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
        background: -o-linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
        background: -ms-linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
        background: linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ededed',GradientType=1 );
        -webkit-box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
        -moz-box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
        -o-box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
      box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
        color: #909090;
    }
    .accordion .slide > h2 b { background: #ffffff; color: #909090; text-shadow: -1px 1px 0 white }
    .accordion .slide > h2.selected span, .accordion .slide h2.selected span:hover, .accordion .slide > h2.selected b { background: #ffffff }
    .accordion .slide > div { background: #a0a0a0; margin-left: 5px }
     
    /*************************************** Rounded */
    .rounded, .rounded > ol { -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px }
    .rounded .slide > h2 span { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px }
     
    /******************************************** IE */
    .ie .slide > h2 b { top: 42%; left: 5% }
    .ie9 .slide > h2 { filter: none; -ms-transform: translateX(-100%) rotate(-90deg); -ms-transform-origin: right top }
    .ie.accordion .slide > h2 b { top: 44% }
    .accordion .slide > h2 span { filter: none }
     
    /******************************************** FA */
    .accordion figure .full { width: 100%; height: 100%; }
    .accordion h2 { border: none; }

    /* centrer l'accordéon */
    .accordion { margin: auto; }


CSS kod ekleyip, tabloyu kişisellestirebilirsiniz Smile

Umarim bu paylaşım işinize yarayacaktır ! cheers



Bu paylaşım Celina tarafından hazırlanmış ve Paradiz tarafından tercüme adilip sunulmuştur.

Paylaşımların başka sitelerde yayınlanması yasaktır.
© 2011 Yetkinforum.net


 Yetkinforum Ilanları N°5 : Akordeon şekli ana sayfa K4xs06
Forum Kuralları + Staff + Grafik Kuralları
-----------------------------------------------------------------
Kurucu şifrenizi mi kaybettiniz ? » çözüm !
Paradiz
Paradiz
Yetkinyönetmen
Yetkinyönetmen

Kadın
Mesaj Sayısı : 9356
Yaş : 518
Uyarı yok

http://forum.forumactif.com/

Sayfa başına dön Aşağa gitmek

Sayfa başına dön

- Similar topics

 
Bu forumun müsaadesi var:
Bu forumdaki mesajlara cevap veremezsiniz