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

    Slide show embeed into a widget?

    avatar
    Guest
    Guest


    Solved Slide show embeed into a widget?

    Post by Guest 24/8/2014, 23:02

    Is it possible to embeed a slide show into a widget? (phpbb2)

    ________________________________________________________________________________
    EDIT: You can close it now. Solved with marquee code instead of slide. :'D Better than the buggy one or nothing...


    Last edited by Fédra on 26/8/2014, 00:52; edited 2 times in total
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51498
    Reputation : 3523
    Language : English
    Location : United States

    Solved Re: Slide show embeed into a widget?

    Post by SLGray 24/8/2014, 23:22

    If you can locate a code, we can see if it will work?



    Slide show embeed into a widget? Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    avatar
    Guest
    Guest


    Solved Re: Slide show embeed into a widget?

    Post by Guest 25/8/2014, 00:35

    Oh, a reply!! Thank you!  Mr. Green 

    I tried to cut things together, and on the homepage everything works perfectly, but when I open a topic the slideshow just loads and it makes the inserted pictures and smileys unable to load as well.  TT 
    The link of my forum: http://tophun.hungarianforum.com/


    Display/ Colors/ CSS
    Code:
    /*
     * jQuery Nivo Slider v2.7.1
     * http://nivo.dev7studios.com
     *
     * Copyright 2011, Gilbert Pellegrom
     * Free to use and abuse under the MIT license.
     * http://www.opensource.org/licenses/mit-license.php
     *
     * March 2010
     */
     
     
    /* The Nivo Slider styles */
    .nivoSlider {
       position:relative;
    }
    .nivoSlider img {
       position:absolute;
       top:0px;
       left:0px;
    }
    /* If an image is wrapped in a link */
    .nivoSlider a.nivo-imageLink {
       position:absolute;
       top:0px;
       left:0px;
       width:100%;
       height:100%;
       border:0;
       padding:0;
       margin:0;
       z-index:6;
       display:none;
    }
    /* The slices and boxes in the Slider */
    .nivo-slice {
       display:block;
       position:absolute;
       z-index:0;
       height:100%;
    }
    .nivo-box {
       display:block;
       position:absolute;
       z-index:0;
    }
    /* Caption styles */
    .nivo-caption {
       position:absolute;
       left:0px;
       bottom:0px;
       background:#000;
       color:#fff;
       opacity:0.8; /* Overridden by captionOpacity setting */
       width:100%;
       z-index:8;
    }
    .nivo-caption p {
       padding:5px;
       margin:0;
    }
    .nivo-caption a {
       display:inline !important;
    }
    .nivo-html-caption {
        display:none;
    }
    /* Direction nav styles (e.g. Next & Prev) */
    .nivo-directionNav a {
       position:absolute;
       top:45%;
       z-index:9;
       cursor:pointer;
    }
    .nivo-prevNav {
       left:0px;
    }
    .nivo-nextNav {
       right:0px;
    }
    /* Control nav styles (e.g. 1,2,3...) */
    .nivo-controlNav a {
       position:relative;
       z-index:9;
       cursor:pointer;
    }
    .nivo-controlNav a.active {
       font-weight:bold;
    }
    /*
    Skin Name: Nivo Slider Default Theme
    Skin URI: http://nivo.dev7studios.com
    Skin Type: flexible
    Description: The default skin for the Nivo Slider.
    Version: 1.0
    Author: Gilbert Pellegrom
    Author URI: http://dev7studios.com
    */

    .theme-default .nivoSlider {
       position:relative;
       background:#ffe7a7 url(http://i46.servimg.com/u/f46/15/66/68/20/loadin10.gif) no-repeat 50% 50%;
       }
    .theme-default .nivoSlider img {
       position:absolute;
       top:0px;
       left:0px;
       display:none;
    }
    .theme-default .nivoSlider a {
       border:0;
       display:block;
    }

    .theme-default .nivo-controlNav {
       position:absolute;
       left:50%;
       bottom:0px;
        margin-left:0px; /* Tweak this to center bullets */
    }
    .theme-default .nivo-controlNav a {
       display:block;
       width:22px;
       height:22px;
       background:url(http://i1320.photobucket.com/albums/u537/MayaGrayx3/gombci-1.png) no-repeat;
       text-indent:-9999px;
       border:0;
       margin-right:3px;
       float:left;
    }
    .theme-default .nivo-controlNav a.active {
       background-position:0 -22px;
    }

    .theme-default .nivo-directionNav a {
       display:block;
       width:30px;
       height:30px;
       background:url(http://i46.servimg.com/u/f46/15/66/68/20/arrows10.png) no-repeat;
       text-indent:-9999px;
       border:0;
    }
    .theme-default a.nivo-nextNav {
       background-position:-30px 0;
       right:15px;
    }
    .theme-default a.nivo-prevNav {
       left:15px;
    }

    .theme-default .nivo-caption {
        font-family: Helvetica, Arial, sans-serif;
    }
    .theme-default .nivo-caption a {
        color:#ffe7a7;
        border-bottom:0px dotted #fff;
    }
    .theme-default .nivo-caption a:hover {
        color:#ffe7a7;
    }

    Display/ Templates/ Portal/ mod_recent_topics
    Code:
    <td width=50% align="top">
      <div style="width:300px;margin:10px auto;">
       
       <div class="slider-wrapper theme-default">
          
          <div style="width:380px;height:138px;" class="nivoSlider" id="nivoslider-125">
              <a href="http://www.youtube.com/user/ToP2entertainment"><img alt="video" src="http://i1320.photobucket.com/albums/u537/MayaGrayx3/slide1-2.png" /></a>
                          <a href="http://www.youtube.com/user/top2ZooYork"><img alt="ZooYork" src="http://i1320.photobucket.com/albums/u537/MayaGrayx3/slide2-1.png" /></a>
                            <img alt="Ruezy" src="http://i1320.photobucket.com/albums/u537/MayaGrayx3/slide3-1.png" />
                          <a href="http://top2.igg.com/event/wage_stat/"><img alt="90 óra" src="http://i1320.photobucket.com/albums/u537/MayaGrayx3/slide4-1.png" /></a>
                          <a href="http://tophun.hungarianforum.com/t92-allando-ingyen-kaja-free-lunch-event"><img alt="Ingyen cuccok" src="http://i1320.photobucket.com/albums/u537/MayaGrayx3/slide5-1.png" /></a>
                          <a href="http://top2.igg.com/event/carnival/"><img alt="Napi 50 credit" src="http://i1320.photobucket.com/albums/u537/MayaGrayx3/slide6-1.png" /></a>
          </div>
          
          <div class="nivo-html-caption" id="nivoslider-125-caption-0">
              A Te képed is ide kerülhet!  
          </div>
     <p>      
    <script type="text/javascript">
      
     
      
    jQuery(window).load(function(){
        jQuery("#nivoslider-125").nivoSlider({
            effect:"random",
            slices:15,
            boxCols:8,
            boxRows:4,
            animSpeed:500,
            pauseTime:3000,
            startSlide:0,
            directionNav:true,
            directionNavHide:true,
            controlNav:true,
            controlNavThumbs:false,
            controlNavThumbsFromRel:true,
            keyboardNav:true,
            pauseOnHover:true,
            manualAdvance:false
        });
    });
    </script>
     </p>   
      </table></td></tr></tbody></table>
    <!-- END classical_row -->

    Modules/ Javascript codes managament/ In the home page (if I set it to ' In all the pages', the slideshow doesn't work on the main page either :\)
    Code:
    /*
     * jQuery Nivo Slider v2.7
     * http://nivo.dev7studios.com
     *
     * Copyright 2011, Gilbert Pellegrom
     * Free to use and abuse under the MIT license.
     * http://www.opensource.org/licenses/mit-license.php
     *
     * March 2010
     */

    (function(a){var b=function(b,c){var d=a.extend({},a.fn.nivoSlider.defaults,c);var e={currentSlide:0,currentImage:"",totalSlides:0,running:false,paused:false,stop:false};var f=a(b);f.data("nivo:vars",e);f.css("position","relative");f.addClass("nivoSlider");var g=f.children();g.each(function(){var b=a(this);var c="";if(!b.is("img")){if(b.is("a")){b.addClass("nivo-imageLink");c=b}b=b.find("img:first")}var d=b.width();if(d==0)d=b.attr("width");var g=b.height();if(g==0)g=b.attr("height");if(d>f.width()){f.width(d)}if(g>f.height()){f.height(g)}if(c!=""){c.css("display","none")}b.css("display","none");e.totalSlides++});if(d.randomStart){d.startSlide=Math.floor(Math.random()*e.totalSlides)}if(d.startSlide>0){if(d.startSlide>=e.totalSlides)d.startSlide=e.totalSlides-1;e.currentSlide=d.startSlide}if(a(g[e.currentSlide]).is("img")){e.currentImage=a(g[e.currentSlide])}else{e.currentImage=a(g[e.currentSlide]).find("img:first")}if(a(g[e.currentSlide]).is("a")){a(g[e.currentSlide]).css("display","block")}f.css("background",'url("'+e.currentImage.attr("src")+'") no-repeat');f.append(a('<div class="nivo-caption"><p></p></div>').css({display:"none",opacity:d.captionOpacity}));var h=function(b){var c=a(".nivo-caption",f);if(e.currentImage.attr("title")!=""&&e.currentImage.attr("title")!=undefined){var d=e.currentImage.attr("title");if(d.substr(0,1)=="#")d=a(d).html();if(c.css("display")=="block"){c.find("p").stop().fadeOut(b.animSpeed,function(){a(this).html(d);a(this).stop().fadeIn(b.animSpeed)})}else{c.find("p").html(d)}c.stop().fadeIn(b.animSpeed)}else{c.stop().fadeOut(b.animSpeed)}};h(d);var i=0;if(!d.manualAdvance&&g.length>1){i=setInterval(function(){o(f,g,d,false)},d.pauseTime)}if(d.directionNav){f.append('<div class="nivo-directionNav"><a class="nivo-prevNav">'+d.prevText+'</a><a class="nivo-nextNav">'+d.nextText+"</a></div>");if(d.directionNavHide){a(".nivo-directionNav",f).hide();f.hover(function(){a(".nivo-directionNav",f).show()},function(){a(".nivo-directionNav",f).hide()})}a("a.nivo-prevNav",f).live("click",function(){if(e.running)return false;clearInterval(i);i="";e.currentSlide-=2;o(f,g,d,"prev")});a("a.nivo-nextNav",f).live("click",function(){if(e.running)return false;clearInterval(i);i="";o(f,g,d,"next")})}if(d.controlNav){var j=a('<div class="nivo-controlNav"></div>');f.append(j);for(var k=0;k<g.length;k++){if(d.controlNavThumbs){var l=g.eq(k);if(!l.is("img")){l=l.find("img:first")}if(d.controlNavThumbsFromRel){j.append('<a class="nivo-control" rel="'+k+'"><img src="'+l.attr("rel")+'" alt="" /></a>')}else{j.append('<a class="nivo-control" rel="'+k+'"><img src="'+l.attr("src").replace(d.controlNavThumbsSearch,d.controlNavThumbsReplace)+'" alt="" /></a>')}}else{j.append('<a class="nivo-control" rel="'+k+'">'+(k+1)+"</a>")}}a(".nivo-controlNav a:eq("+e.currentSlide+")",f).addClass("active");a(".nivo-controlNav a",f).live("click",function(){if(e.running)return false;if(a(this).hasClass("active"))return false;clearInterval(i);i="";f.css("background",'url("'+e.currentImage.attr("src")+'") no-repeat');e.currentSlide=a(this).attr("rel")-1;o(f,g,d,"control")})}if(d.keyboardNav){a(window).keypress(function(a){if(a.keyCode=="37"){if(e.running)return false;clearInterval(i);i="";e.currentSlide-=2;o(f,g,d,"prev")}if(a.keyCode=="39"){if(e.running)return false;clearInterval(i);i="";o(f,g,d,"next")}})}if(d.pauseOnHover){f.hover(function(){e.paused=true;clearInterval(i);i=""},function(){e.paused=false;if(i==""&&!d.manualAdvance){i=setInterval(function(){o(f,g,d,false)},d.pauseTime)}})}f.bind("nivo:animFinished",function(){e.running=false;a(g).each(function(){if(a(this).is("a")){a(this).css("display","none")}});if(a(g[e.currentSlide]).is("a")){a(g[e.currentSlide]).css("display","block")}if(i==""&&!e.paused&&!d.manualAdvance){i=setInterval(function(){o(f,g,d,false)},d.pauseTime)}d.afterChange.call(this)});var m=function(b,c,d){for(var e=0;e<c.slices;e++){var f=Math.round(b.width()/c.slices);if(e==c.slices-1){b.append(a('<div class="nivo-slice"></div>').css({left:f*e+"px",width:b.width()-f*e+"px",height:"0px",opacity:"0",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(f+e*f-f)+"px 0%"}))}else{b.append(a('<div class="nivo-slice"></div>').css({left:f*e+"px",width:f+"px",height:"0px",opacity:"0",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(f+e*f-f)+"px 0%"}))}}};var n=function(b,c,d){var e=Math.round(b.width()/c.boxCols);var f=Math.round(b.height()/c.boxRows);for(var g=0;g<c.boxRows;g++){for(var h=0;h<c.boxCols;h++){if(h==c.boxCols-1){b.append(a('<div class="nivo-box"></div>').css({opacity:0,left:e*h+"px",top:f*g+"px",width:b.width()-e*h+"px",height:f+"px",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(e+h*e-e)+"px -"+(f+g*f-f)+"px"}))}else{b.append(a('<div class="nivo-box"></div>').css({opacity:0,left:e*h+"px",top:f*g+"px",width:e+"px",height:f+"px",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(e+h*e-e)+"px -"+(f+g*f-f)+"px"}))}}}};var o=function(b,c,d,e){var f=b.data("nivo:vars");if(f&&f.currentSlide==f.totalSlides-1){d.lastSlide.call(this)}if((!f||f.stop)&&!e)return false;d.beforeChange.call(this);if(!e){b.css("background",'url("'+f.currentImage.attr("src")+'") no-repeat')}else{if(e=="prev"){b.css("background",'url("'+f.currentImage.attr("src")+'") no-repeat')}if(e=="next"){b.css("background",'url("'+f.currentImage.attr("src")+'") no-repeat')}}f.currentSlide++;if(f.currentSlide==f.totalSlides){f.currentSlide=0;d.slideshowEnd.call(this)}if(f.currentSlide<0)f.currentSlide=f.totalSlides-1;if(a(c[f.currentSlide]).is("img")){f.currentImage=a(c[f.currentSlide])}else{f.currentImage=a(c[f.currentSlide]).find("img:first")}if(d.controlNav){a(".nivo-controlNav a",b).removeClass("active");a(".nivo-controlNav a:eq("+f.currentSlide+")",b).addClass("active")}h(d);a(".nivo-slice",b).remove();a(".nivo-box",b).remove();var g=d.effect;if(d.effect=="random"){var i=new Array("sliceDownRight","sliceDownLeft","sliceUpRight","sliceUpLeft","sliceUpDown","sliceUpDownLeft","fold","fade","boxRandom","boxRain","boxRainReverse","boxRainGrow","boxRainGrowReverse");g=i[Math.floor(Math.random()*(i.length+1))];if(g==undefined)g="fade"}if(d.effect.indexOf(",")!=-1){var i=d.effect.split(",");g=i[Math.floor(Math.random()*i.length)];if(g==undefined)g="fade"}if(f.currentImage.attr("data-transition")){g=f.currentImage.attr("data-transition")}f.running=true;if(g=="sliceDown"||g=="sliceDownRight"||g=="sliceDownLeft"){m(b,d,f);var j=0;var k=0;var l=a(".nivo-slice",b);if(g=="sliceDownLeft")l=a(".nivo-slice",b)._reverse();l.each(function(){var c=a(this);c.css({top:"0px"});if(k==d.slices-1){setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed)},100+j)}j+=50;k++})}else if(g=="sliceUp"||g=="sliceUpRight"||g=="sliceUpLeft"){m(b,d,f);var j=0;var k=0;var l=a(".nivo-slice",b);if(g=="sliceUpLeft")l=a(".nivo-slice",b)._reverse();l.each(function(){var c=a(this);c.css({bottom:"0px"});if(k==d.slices-1){setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed)},100+j)}j+=50;k++})}else if(g=="sliceUpDown"||g=="sliceUpDownRight"||g=="sliceUpDownLeft"){m(b,d,f);var j=0;var k=0;var o=0;var l=a(".nivo-slice",b);if(g=="sliceUpDownLeft")l=a(".nivo-slice",b)._reverse();l.each(function(){var c=a(this);if(k==0){c.css("top","0px");k++}else{c.css("bottom","0px");k=0}if(o==d.slices-1){setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed)},100+j)}j+=50;o++})}else if(g=="fold"){m(b,d,f);var j=0;var k=0;a(".nivo-slice",b).each(function(){var c=a(this);var e=c.width();c.css({top:"0px",height:"100%",width:"0px"});if(k==d.slices-1){setTimeout(function(){c.animate({width:e,opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({width:e,opacity:"1.0"},d.animSpeed)},100+j)}j+=50;k++})}else if(g=="fade"){m(b,d,f);var q=a(".nivo-slice:first",b);q.css({height:"100%",width:b.width()+"px"});q.animate({opacity:"1.0"},d.animSpeed*2,"",function(){b.trigger("nivo:animFinished")})}else if(g=="slideInRight"){m(b,d,f);var q=a(".nivo-slice:first",b);q.css({height:"100%",width:"0px",opacity:"1"});q.animate({width:b.width()+"px"},d.animSpeed*2,"",function(){b.trigger("nivo:animFinished")})}else if(g=="slideInLeft"){m(b,d,f);var q=a(".nivo-slice:first",b);q.css({height:"100%",width:"0px",opacity:"1",left:"",right:"0px"});q.animate({width:b.width()+"px"},d.animSpeed*2,"",function(){q.css({left:"0px",right:""});b.trigger("nivo:animFinished")})}else if(g=="boxRandom"){n(b,d,f);var r=d.boxCols*d.boxRows;var k=0;var j=0;var s=p(a(".nivo-box",b));s.each(function(){var c=a(this);if(k==r-1){setTimeout(function(){c.animate({opacity:"1"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({opacity:"1"},d.animSpeed)},100+j)}j+=20;k++})}else if(g=="boxRain"||g=="boxRainReverse"||g=="boxRainGrow"||g=="boxRainGrowReverse"){n(b,d,f);var r=d.boxCols*d.boxRows;var k=0;var j=0;var t=0;var u=0;var v=new Array;v[t]=new Array;var s=a(".nivo-box",b);if(g=="boxRainReverse"||g=="boxRainGrowReverse"){s=a(".nivo-box",b)._reverse()}s.each(function(){v[t][u]=a(this);u++;if(u==d.boxCols){t++;u=0;v[t]=new Array}});for(var w=0;w<d.boxCols*2;w++){var x=w;for(var y=0;y<d.boxRows;y++){if(x>=0&&x<d.boxCols){(function(c,e,f,h,i){var j=a(v[c][e]);var k=j.width();var l=j.height();if(g=="boxRainGrow"||g=="boxRainGrowReverse"){j.width(0).height(0)}if(h==i-1){setTimeout(function(){j.animate({opacity:"1",width:k,height:l},d.animSpeed/1.3,"",function(){b.trigger("nivo:animFinished")})},100+f)}else{setTimeout(function(){j.animate({opacity:"1",width:k,height:l},d.animSpeed/1.3)},100+f)}})(y,x,j,k,r);k++}x--}j+=100}}};var p=function(a){for(var b,c,d=a.length;d;b=parseInt(Math.random()*d),c=a[--d],a[d]=a[b],a[b]=c);return a};var q=function(a){if(this.console&&typeof console.log!="undefined")console.log(a)};this.stop=function(){if(!a(b).data("nivo:vars").stop){a(b).data("nivo:vars").stop=true;q("Stop Slider")}};this.start=function(){if(a(b).data("nivo:vars").stop){a(b).data("nivo:vars").stop=false;q("Start Slider")}};d.afterLoad.call(this);return this};a.fn.nivoSlider=function(c){return this.each(function(d,e){var f=a(this);if(f.data("nivoslider"))return f.data("nivoslider");var g=new b(this,c);f.data("nivoslider",g)})};a.fn.nivoSlider.defaults={effect:"random",slices:15,boxCols:8,boxRows:4,animSpeed:500,pauseTime:3e3,startSlide:0,directionNav:true,directionNavHide:true,controlNav:true,controlNavThumbs:false,controlNavThumbsFromRel:false,controlNavThumbsSearch:".jpg",controlNavThumbsReplace:"_thumb.jpg",keyboardNav:true,pauseOnHover:true,manualAdvance:false,captionOpacity:.8,prevText:"Prev",nextText:"Next",randomStart:false,beforeChange:function(){},afterChange:function(){},slideshowEnd:function(){},lastSlide:function(){},afterLoad:function(){}};a.fn._reverse=[].reverse})(jQuery)



    I tried to look for codes that makes the widget hidden when someone reads a topic, but none of them worked.   beu
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51498
    Reputation : 3523
    Language : English
    Location : United States

    Solved Re: Slide show embeed into a widget?

    Post by SLGray 27/8/2014, 07:38

    Fédra wrote:EDIT: You can close it now. Solved with marquee code instead of slide. :'D Better than the buggy one or nothing...
    Topic solved and archived



    Slide show embeed into a widget? Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.

      Current date/time is 23/9/2024, 04:35