The forum of the forums

Would you like to react to this message? Create an account in a few clicks or log in to continue.
The forum of the forums
3 posters

    how to make slides?

    Clickme1
    avatar
    Clickme1
    New Member


    Posts : 8
    Reputation : 1
    Language : English
    • Post n°1

    Solved how to make slides?

    Post by Clickme1 June 28th 2013, 9:22 am

    hello, I am kinda new to forumotion and I would like to know how to make the slides in this page. http://unitednation.forumsmotions.com/ 

    https://i.servimg.com/u/f83/18/09/23/03/screen11.jpg 

    thanks
    • Back to top
    mangaka
    mangaka
    mangaka
    Forumember


    Female Posts : 121
    Reputation : 5
    Language : Indonesia
    Location : Well
    • Post n°2

    Solved Re: how to make slides?

    Post by mangaka June 28th 2013, 10:53 am

    Hi,

    try this code

    Code:
    <h2 class="selected" style="width: 320px; height: 48px; left: 0px;"><span>Title for the first tab goes here</span><b>1</b></h2><div id="s1" style="width: 508px; left: 0px; padding-left: 48px;"></div><li>
                <h2 class="" style="width: 320px; height: 48px; left: 0px;"><span>Slide One</span><b>1</b></h2>
      <li>
                <h2 class="selected" style="width: 320px; height: 48px; left: 48px;"><span>Slide Two</span><b>2</b></h2>
                <div id="s2" style="width: 508px; left: 48px; padding-left: 48px;"></div>
            </li><li>
                <h2 class="" style="width: 320px; height: 48px; left: 96px;"><span>Slide Three</span><b>3</b></h2>
                <div id="s3" style="width: 508px; left: 96px; padding-left: 48px;"></div>
            </li><li>
                <h2 class="" style="width: 320px; height: 48px; left: 652px;"><span>Slide Four</span><b>4</b></h2>
                <div id="s4" style="width: 508px; left: 652px; padding-left: 48px;"></div>
            </li><ol>
            <li>
                <h2 class="" style="width: 320px; height: 48px; left: 0px;"><span>Slide One</span><b>1</b></h2>
                <div id="s1" style="width: 508px; left: 0px; padding-left: 48px;"></div>
            </li>
            <li>
                <h2 class="" style="width: 320px; height: 48px; left: 48px;"><span>Slide Two</span><b>2</b></h2>
                <div id="s2" style="width: 508px; left: 48px; padding-left: 48px;"></div>
            </li>
            <li>
                <h2 class="selected" style="width: 320px; height: 48px; left: 96px;"><span>Slide Three</span><b>3</b></h2>
                <div id="s3" style="width: 508px; left: 96px; padding-left: 48px;"></div>
            </li>
            <li>
                <h2 class="" style="width: 320px; height: 48px; left: 652px;"><span>Slide Four</span><b>4</b></h2>
                <div id="s4" style="width: 508px; left: 652px; padding-left: 48px;"></div>
            </li>
        </ol>

    Sorry,my code was mess up..Because i don't test it before XD i will contact you if this code was working Wink
    • Back to top
    Clickme1
    avatar
    Clickme1
    New Member


    Posts : 8
    Reputation : 1
    Language : English
    • Post n°3

    Solved Re: how to make slides?

    Post by Clickme1 June 28th 2013, 11:31 am

    thanks but it kinda ended like this https://i.servimg.com/u/f36/18/34/16/69/screen10.png
    • Back to top
    mangaka
    mangaka
    mangaka
    Forumember


    Female Posts : 121
    Reputation : 5
    Language : Indonesia
    Location : Well
    • Post n°4

    Solved Re: how to make slides?

    Post by mangaka June 28th 2013, 1:36 pm

    Hhmm..I'm just browsing and found the answer Smile

    go to ACP>>Modules>>Javascript Management>>Tick "In the homepage"

    paste this:

    Code:
    $(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);

    And go to ACP>>Display>>Generalities

    Paste this code:

    Code:
    <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>

    And for the 1st image,go to ACP>>Display>>Colors>>Stylesheet Tab

    Paste this:

    Code:
            @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; }

    Slide two

    Paste at ACP>>Display>>Colors>>Stylesheet Tab

    Code:
    @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; }

    Slide three

    ACP>>Display>>Colors>>Stylesheet Tab

    Code:
     @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; }

    Sorry i just can make 3 tabs....
    • Back to top
    Clickme1
    avatar
    Clickme1
    New Member


    Posts : 8
    Reputation : 1
    Language : English
    • Post n°5

    Solved Re: how to make slides?

    Post by Clickme1 June 29th 2013, 9:26 am

    sorry but i followed everything you said and nothing came out...
    • Back to top
    Clickme1
    avatar
    Clickme1
    New Member


    Posts : 8
    Reputation : 1
    Language : English
    • Post n°6

    Solved Re: how to make slides?

    Post by Clickme1 June 30th 2013, 6:04 am

    i know how it works now thanks its solved :p
    • Back to top
    Sanket
    Sanket
    Sanket
    ForumGuru


    Male Posts : 48766
    Reputation : 2830
    Language : English
    Location : Mumbai
    • Post n°7

    Solved Re: how to make slides?

    Post by Sanket June 30th 2013, 6:20 am

    Solved & Archived.
    • Back to top

      Current date/time is September 22nd 2024, 10:18 pm