Przewijane ogłoszenia. [szukam]

Założony przez  shift.

20.09.2013, 21:59
#1
wersja skryptu MyBB: 1.6.10 :heart:
adres forum: Forum
na czym polega problem (screen, opis, komunikaty): Potrzebuję takiej tabelki z przewijanymi obrazkami jak na cs-soplica.com. Tamto forum jest na IPB, ale może ktoś coś pomoże :) Chodzi mi o styl przewijania, tak żeby co pare sekund samo sie przewijało. Nie wiem jakie cssy wpisać, i co wpisać w headerze. :( Proszę o pomoc.

PS: Jeśli zły dział, to przepraszam.

Link: >>> KLIK <<<
#1[Obrazek: 84869174554551918150.png]
#2[Obrazek: 28891593113136444062.png]
SLAVOO napisał 20.09.2013, 22:16:
[Obrazek: modnotice_howto.png]

Pisz w odpowiednim dziale!
20.09.2013, 22:19
#2
Polecam Ci: http://cssglobe.com/lab/easyslider1.7/01.html

Pobierz, skopiuj HTML, CSS'a i JS, zaimplementuj jQuery jeżeli nie masz i dodaj no.conflict. Mam nadzieję, że rozumiesz.
Strony internetowe Wordpress
20.09.2013, 22:21 (Ten post był ostatnio modyfikowany: 20.09.2013, 22:42 przez shift.)
#3
Nie rozumiem :/ Możesz jakoś to opisać? Byłbym bardzo wdzięczny :)


/To skopiować z tego pliczku z download? :)
20.09.2013, 22:46
#4
Wklej to do:

Szablon > Nagłówek > header

<div id="slider">
            <ul>                
                <li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
                <li><a href="http://templatica.com/preview/7"><img src="images/02.jpg" alt="Css Template Preview" /></a></li>
                <li><a href="http://templatica.com/preview/25"><img src="images/03.jpg" alt="Css Template Preview" /></a></li>
                <li><a href="http://templatica.com/preview/26"><img src="images/04.jpg" alt="Css Template Preview" /></a></li>
                <li><a href="http://templatica.com/preview/27"><img src="images/05.jpg" alt="Css Template Preview" /></a></li>            
            </ul>
        </div>

To wklej w niezgrupowane szablony > headerinclude:

<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/easySlider1.7.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function(){    
        jQuery("#slider").easySlider({
            auto: true,
            continuous: true
    });
    });    
</script>

To wklej go styl > nazwa stylu > global.css

#slider{width:700px; position:relative; margin: 0 auto;}
    #slider ul, #slider li,
    #slider2 ul, #slider2 li{
        margin:0;
        padding:0;
        list-style:none;
    }
    #slider2{margin-top:1em;}
    #slider li, #slider2 li{
        width:696px;
        height:241px;
        overflow:hidden;
    }    
    #prevBtn, #nextBtn{display:none;}

Plik easySlider1.7.js z załącznika wrzuć na FTP do folderu jscripts


  easySlider1.7.js (Rozmiar: 5,84 KB / Pobrań: 304)

Jeżeli nie będzie działać, to sprawdź czy na pewno wszystko wykonałeś poprawnie. Jeżeli będziesz pewny w 100% wykonania, to musisz edytować plik z załącznika usunąć wszystko i zastąpić tym i wrzucić ponownie na ftp:

(function(jQuery) {

    jQuery.fn.easySlider = function(options){
      
        // default configuration properties
        var defaults = {            
            prevId:         'prevBtn',
            prevText:         'Previous',
            nextId:         'nextBtn',    
            nextText:         'Next',
            controlsShow:    true,
            controlsBefore:    '',
            controlsAfter:    '',    
            controlsFade:    true,
            firstId:         'firstBtn',
            firstText:         'First',
            firstShow:        false,
            lastId:         'lastBtn',    
            lastText:         'Last',
            lastShow:        false,                
            vertical:        false,
            speed:             1000,
            auto:            false,
            pause:            2000,
            continuous:        false,
            numeric:         false,
            numericId:         'controls'
        };
        
        var options = jQuery.extend(defaults, options);  
                
        this.each(function() {  
            var obj = jQuery(this);                 
            var s = jQuery("li", obj).length;
            var w = jQuery("li", obj).width();
            var h = jQuery("li", obj).height();
            var clickable = true;
            obj.width(w);
            obj.height(h);
            obj.css("overflow","hidden");
            var ts = s-1;
            var t = 0;
            jQuery("ul", obj).css('width',s*w);            
            
            if(options.continuous){
                jQuery("ul", obj).prepend(jQuery("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px"));
                jQuery("ul", obj).append(jQuery("ul li:nth-child(2)", obj).clone());
                jQuery("ul", obj).css('width',(s+1)*w);
            };                
            
            if(!options.vertical) jQuery("li", obj).css('float','left');
                                
            if(options.controlsShow){
                var html = options.controlsBefore;                
                if(options.numeric){
                    html += '<ol id="'+ options.numericId +'"></ol>';
                } else {
                    if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>';
                    html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>';
                    html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>';
                    if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>';                
                };
                
                html += options.controlsAfter;                        
                jQuery(obj).after(html);                                        
            };
            
            if(options.numeric){                                    
                for(var i=0;i<s;i++){                        
                    jQuery(document.createElement("li"))
                        .attr('id',options.numericId + (i+1))
                        .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>')
                        .appendTo(jQuery("#"+ options.numericId))
                        .click(function(){                            
                            animate(jQuery("a",jQuery(this)).attr('rel'),true);
                        });                                                 
                };                            
            } else {
                jQuery("a","#"+options.nextId).click(function(){        
                    animate("next",true);
                });
                jQuery("a","#"+options.prevId).click(function(){        
                    animate("prev",true);                
                });    
                jQuery("a","#"+options.firstId).click(function(){        
                    animate("first",true);
                });                
                jQuery("a","#"+options.lastId).click(function(){        
                    animate("last",true);                
                });                
            };
            
            function setCurrent(i){
                i = parseInt(i)+1;
                jQuery("li", "#" + options.numericId).removeClass("current");
                jQuery("li#" + options.numericId + i).addClass("current");
            };
            
            function adjust(){
                if(t>ts) t=0;        
                if(t<0) t=ts;    
                if(!options.vertical) {
                    jQuery("ul",obj).css("margin-left",(t*w*-1));
                } else {
                    jQuery("ul",obj).css("margin-left",(t*h*-1));
                }
                clickable = true;
                if(options.numeric) setCurrent(t);
            };
            
            function animate(dir,clicked){
                if (clickable){
                    clickable = false;
                    var ot = t;                
                    switch(dir){
                        case "next":
                            t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1;                        
                            break;
                        case "prev":
                            t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1;
                            break;
                        case "first":
                            t = 0;
                            break;
                        case "last":
                            t = ts;
                            break;
                        default:
                            t = dir;
                            break;
                    };    
                    var diff = Math.abs(ot-t);
                    var speed = diff*options.speed;                        
                    if(!options.vertical) {
                        p = (t*w*-1);
                        jQuery("ul",obj).animate(
                            { marginLeft: p },
                            { queue:false, duration:speed, complete:adjust }
                        );                
                    } else {
                        p = (t*h*-1);
                        jQuery("ul",obj).animate(
                            { marginTop: p },
                            { queue:false, duration:speed, complete:adjust }
                        );                    
                    };
                    
                    if(!options.continuous && options.controlsFade){                    
                        if(t==ts){
                            jQuery("a","#"+options.nextId).hide();
                            jQuery("a","#"+options.lastId).hide();
                        } else {
                            jQuery("a","#"+options.nextId).show();
                            jQuery("a","#"+options.lastId).show();                    
                        };
                        if(t==0){
                            jQuery("a","#"+options.prevId).hide();
                            jQuery("a","#"+options.firstId).hide();
                        } else {
                            jQuery("a","#"+options.prevId).show();
                            jQuery("a","#"+options.firstId).show();
                        };                    
                    };                
                    
                    if(clicked) clearTimeout(timeout);
                    if(options.auto && dir=="next" && !clicked){;
                        timeout = setTimeout(function(){
                            animate("next",false);
                        },diff*options.speed+options.pause);
                    };
            
                };
                
            };
            // init
            var timeout;
            if(options.auto){;
                timeout = setTimeout(function(){
                    animate("next",false);
                },options.pause);
            };        
            
            if(options.numeric) setCurrent(0);
        
            if(!options.continuous && options.controlsFade){                    
                jQuery("a","#"+options.prevId).hide();
                jQuery("a","#"+options.firstId).hide();                
            };                
            
        });
      
    };

})(jQuery);
Strony internetowe Wordpress
20.09.2013, 23:25
#5
Nie działa, zrobiłem wszystko tak jak kazałeś.

Efekt:

[Obrazek: 73482151556934481513.png]
20.09.2013, 23:29
#6
Daj jakiś link do tego.
Strony internetowe Wordpress
20.09.2013, 23:31 (Ten post był ostatnio modyfikowany: 02.12.2013, 22:25 przez shift.)
#7
LINK :)
21.09.2013, 08:14
#8
Pokaż headerinclude (ACP -> Style i Szablony -> Szablony -> Twój_Szablon -> Niezgrupowane szablony).
21.09.2013, 11:05
#9
headerinclude, proszę: :)
<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />
<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />
<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/pl_PL/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>





<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/tiptip.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/yetii.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script><script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/gw2/MyGW2Code.js"></script><link rel="stylesheet" type="text/css" href="{$mybb->settings['bburl']}/inc/gw2/MyGW2Code.css" /><script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/gw2/MyGW2Code.js"></script><link rel="stylesheet" type="text/css" href="{$mybb->settings['bburl']}/inc/gw2/MyGW2Code.css" /><script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/gw2/MyGW2Code.js"></script><link rel="stylesheet" type="text/css" href="{$mybb->settings['bburl']}/inc/gw2/MyGW2Code.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery.cookie.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/sidebar_2.0.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
{$stylesheets}
<script>
jQuery.noConflict();
jQuery(document).ready(function(){
    jQuery(function () {
        // scroll body to 0px on click
        jQuery('#back-top').click(function () {
            jQuery('body,html').animate({
                scrollTop: 0
            }, 800);
            return false;
        });
    });
        jQuery(".loginbutton").click(function(e) {
            e.preventDefault();
            jQuery(".loginbutton_menu").slideToggle("fast");
            jQuery(".loginbutton").toggleClass("loginbutton_menu_open");
        });
        jQuery(".loginbutton_menu").mouseup(function() {
            return false
        });
        jQuery(document).mouseup(function(e) {
            if(jQuery(e.target).parent("a.loginbutton").length==0) {
                jQuery(".loginbutton").removeClass("loginbutton_menu_open");
                jQuery(".loginbutton_menu").slideUp("fast",  function() {display: 'toggle'});;
            }
            
        });
jQuery(function(){
jQuery(".pmpopup").tipTip({defaultPosition: "top", fadeIn: 300});
});
});
</script>



<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/images/deflection/functions.js"></script>
<script type="text/javascript">
<!--
    var cookieDomain = "{$mybb->settings['cookiedomain']}";
    var cookiePath = "{$mybb->settings['cookiepath']}";
    var cookiePrefix = "{$mybb->settings['cookieprefix']}";
    var deleteevent_confirm = "{$lang->deleteevent_confirm}";
    var removeattach_confirm = "{$lang->removeattach_confirm}";
    var loading_text = '{$lang->ajax_loading}';
    var saving_changes = '{$lang->saving_changes}';
    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";
    var my_post_key = "{$mybb->post_code}";
    var imagepath = "{$theme['imgdir']}";
// -->
</script>





<script>
jQuery.noConflict();
jQuery(document).ready(function() {    
    //select all the a tag with name equal to modal
    jQuery('a[name=modal]').click(function(e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = jQuery(this).attr('href');
    
        //Get the screen height and width
        var maskHeight = jQuery(document).height();
        var maskWidth = jQuery(window).width();
    
        //Set height and width to mask to fill up the whole screen
        jQuery('#mask').css({'width':maskWidth,'height':maskHeight});
        
        //transition effect        
        jQuery('#mask').fadeIn("fast");
        jQuery('#mask').fadeTo("slow",0.5);    
    
        //Get the window height and width
        var winH = jQuery(window).height();
        var winW = jQuery(window).width();
              
    
        //transition effect
        jQuery(id).fadeIn("slow");
    
    });
    
    //if close button is clicked
    jQuery('.window .close').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        jQuery('#mask, .window, #loginbox').fadeOut("slow");
    });        
    
    //if mask is clicked
    jQuery('#mask').click(function () {
        jQuery(this).fadeOut("slow");
        jQuery('.window').fadeOut("slow");
    });            
    
});
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script type="text/javascript">jQuery.noConflict();</script>

{$newpmmsg}
<script language="javascript" type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/custom_status.js"></script>




<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/easySlider1.7.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function(){    
        jQuery("#slider").easySlider({
            auto: true,
            continuous: true
    });
    });    
</script>
21.09.2013, 11:34
#10
Huhuhuhu to będzie trudne :D

Spróbuj tak:
<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />
<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />
<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/pl_PL/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>





<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/tiptip.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/yetii.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/gw2/MyGW2Code.js"></script><link rel="stylesheet" type="text/css" href="{$mybb->settings['bburl']}/inc/gw2/MyGW2Code.css" />
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery.cookie.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/sidebar_2.0.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
{$stylesheets}
<script>
jQuery.noConflict();
jQuery(document).ready(function(){
    jQuery(function () {
        // scroll body to 0px on click
        jQuery('#back-top').click(function () {
            jQuery('body,html').animate({
                scrollTop: 0
            }, 800);
            return false;
        });
    });
        jQuery(".loginbutton").click(function(e) {
            e.preventDefault();
            jQuery(".loginbutton_menu").slideToggle("fast");
            jQuery(".loginbutton").toggleClass("loginbutton_menu_open");
        });
        jQuery(".loginbutton_menu").mouseup(function() {
            return false
        });
        jQuery(document).mouseup(function(e) {
            if(jQuery(e.target).parent("a.loginbutton").length==0) {
                jQuery(".loginbutton").removeClass("loginbutton_menu_open");
                jQuery(".loginbutton_menu").slideUp("fast",  function() {display: 'toggle'});;
            }
            
        });
jQuery(function(){
jQuery(".pmpopup").tipTip({defaultPosition: "top", fadeIn: 300});
});
});
</script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/images/deflection/functions.js"></script>
<script type="text/javascript">
<!--
    var cookieDomain = "{$mybb->settings['cookiedomain']}";
    var cookiePath = "{$mybb->settings['cookiepath']}";
    var cookiePrefix = "{$mybb->settings['cookieprefix']}";
    var deleteevent_confirm = "{$lang->deleteevent_confirm}";
    var removeattach_confirm = "{$lang->removeattach_confirm}";
    var loading_text = '{$lang->ajax_loading}';
    var saving_changes = '{$lang->saving_changes}';
    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";
    var my_post_key = "{$mybb->post_code}";
    var imagepath = "{$theme['imgdir']}";
// -->
</script>
<script>
jQuery.noConflict();
jQuery(document).ready(function() {    
    //select all the a tag with name equal to modal
    jQuery('a[name=modal]').click(function(e) {
        //Cancel the link behavior
        e.preventDefault();
        //Get the A tag
        var id = jQuery(this).attr('href');
    
        //Get the screen height and width
        var maskHeight = jQuery(document).height();
        var maskWidth = jQuery(window).width();
    
        //Set height and width to mask to fill up the whole screen
        jQuery('#mask').css({'width':maskWidth,'heigh​t':maskHeight});
        
        //transition effect        
        jQuery('#mask').fadeIn("fast");
        jQuery('#mask').fadeTo("slow",0.5);    
    
        //Get the window height and width
        var winH = jQuery(window).height();
        var winW = jQuery(window).width();
              
    
        //transition effect
        jQuery(id).fadeIn("slow");
    
    });
    
    //if close button is clicked
    jQuery('.window .close').click(function (e) {
        //Cancel the link behavior
        e.preventDefault();
        jQuery('#mask, .window, #loginbox').fadeOut("slow");
    });        
    
    //if mask is clicked
    jQuery('#mask').click(function () {
        jQuery(this).fadeOut("slow");
        jQuery('.window').fadeOut("slow");
    });            
    
});
</script>
{$newpmmsg}
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/easySlider1.7.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function(){    
        jQuery("#slider").easySlider({
            auto: true,
            continuous: true
    });
    });    
</script>
21.09.2013, 11:38
#11
nic, to samo co wcześniej.. ;/
21.09.2013, 12:08
#12
Coś musiałeś źle dodać. Proponuję zacząć od początku.
Jeśli Ci pomogłem naciśnij guzik POMÓGŁ lub dodaj PUNKT REPUTACJI



Użytkownicy przeglądający ten wątek:

1 gości