Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 03-12-2012, 05:03 AM   PM User | #1
shakac
New Coder

 
Join Date: Jun 2010
Posts: 27
Thanks: 1
Thanked 0 Times in 0 Posts
shakac is an unknown quantity at this point
Question please help need in javascript

hello
wj friends please help in javascript.
i figured out all problem and got solution but one i can't figure out please help me

the problem is see this link http://www.sajeebgroup.com in this page see right side update news box. a slider is sliding but before one slider another slide is coming why this.

here is slide javascript code
PHP Code:
(function($) {

    $.
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:             800,
            
auto:            false,
            
pause:            2000,
            
continuous:        false
            
numeric:         false,
            
numericId:         'controls'
        
}; 
        
        var 
options = $.extend(defaultsoptions);  
                
        
this.each(function() {  
            var 
obj = $(this);                 
            var 
= $("li"obj).length;
            var 
= $("li"obj).width(); 
            var 
= $("li"obj).height(); 
            var 
clickable true;
            
obj.width(w); 
            
obj.height(h); 
            
obj.css("overflow","hidden");
            var 
ts s-1;
            var 
0;
            $(
"ul"obj).css('width',s*w);            
            
            if(
options.continuous){
                $(
"ul"obj).prepend($("ul li:last-child"obj).clone().css("margin-left","-"+"px"));
                $(
"ul"obj).append($("ul li:nth-child(2)"obj).clone());
                $(
"ul"obj).css('width',(s+1)*w);
            };                
            
            if(!
options.vertical) $("li"obj).css('float','left');
                                
            if(
options.controlsShow){
                var 
html options.controlsBefore;                
                if(
options.numeric){
                    
html += '<ol id="'options.numericId +'"></ol>';
                } else {
                    if(
options.firstShowhtml += '<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.lastShowhtml += ' <span id="'options.lastId +'"><a href=\"javascript:void(0);\">'options.lastText +'</a></span>';                
                };
                
                
html += options.controlsAfter;                        
                $(
obj).after(html);                                        
            };
            
            if(
options.numeric){                                    
                for(var 
i=0;i<s;i++){                        
                    $(
document.createElement("li"))
                        .
attr('id',options.numericId + (i+1))
                        .
html('<a rel='+' href=\"javascript:void(0);\">'+ (i+1) +'</a>')
                        .
appendTo($("#"options.numericId))
                        .
click(function(){                            
                            
animate($("a",$(this)).attr('rel'),true);
                        });                                                 
                };                            
            } else {
                $(
"a","#"+options.nextId).click(function(){        
                    
animate("next",true);
                });
                $(
"a","#"+options.prevId).click(function(){        
                    
animate("prev",true);                
                });    
                $(
"a","#"+options.firstId).click(function(){        
                    
animate("first",true);
                });                
                $(
"a","#"+options.lastId).click(function(){        
                    
animate("last",true);                
                });                
            };
            
            function 
setCurrent(i){
                
parseInt(i)+1;
                $(
"li""#" options.numericId).removeClass("current");
                $(
"li#" options.numericId i).addClass("current");
            };
            
            function 
adjust(){
                if(
t>tst=0;        
                if(
t<0t=ts;    
                if(!
options.vertical) {
                    $(
"ul",obj).css("margin-left",(t*w*-1));
                } else {
                    $(
"ul",obj).css("margin-left",(t*h*-1));
                }
                
clickable true;
                if(
options.numericsetCurrent(t);
            };
            
            function 
animate(dir,clicked){
                if (
clickable){
                    
clickable false;
                    var 
ot t;                
                    switch(
dir){
                        case 
"next":
                            
= (ot>=ts) ? (options.continuous t+ts) : t+1;                        
                            break; 
                        case 
"prev":
                            
= (t<=0) ? (options.continuous t-0) : t-1;
                            break; 
                        case 
"first":
                            
0;
                            break; 
                        case 
"last":
                            
ts;
                            break; 
                        default:
                            
dir;
                            break; 
                    };    
                    var 
diff Math.abs(ot-t);
                    var 
speed diff*options.speed;                        
                    if(!
options.vertical) {
                        
= (t*w*-1);
                        $(
"ul",obj).animate(
                            { 
marginLeft}, 
                            { 
queue:falseduration:speedcomplete:adjust }
                        );                
                    } else {
                        
= (t*h*-1);
                        $(
"ul",obj).animate(
                            { 
marginTop}, 
                            { 
queue:falseduration:speedcomplete:adjust }
                        );                    
                    };
                    
                    if(!
options.continuous && options.controlsFade){                    
                        if(
t==ts){
                            $(
"a","#"+options.nextId).hide();
                            $(
"a","#"+options.lastId).hide();
                        } else {
                            $(
"a","#"+options.nextId).show();
                            $(
"a","#"+options.lastId).show();                    
                        };
                        if(
t==0){
                            $(
"a","#"+options.prevId).hide();
                            $(
"a","#"+options.firstId).hide();
                        } else {
                            $(
"a","#"+options.prevId).show();
                            $(
"a","#"+options.firstId).show();
                        };                    
                    };                
                    
                    if(
clickedclearTimeout(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.numericsetCurrent(0);
        
            if(!
options.continuous && options.controlsFade){                    
                $(
"a","#"+options.prevId).hide();
                $(
"a","#"+options.firstId).hide();                
            };                
            
        });
      
    };

})(
jQuery); 
here is php to show slide

PHP Code:
<html.
<head>
<style type="text/css">

        #ticker-container {

        position:relative;

        /*overflow:hidden;*/

        width: 190px;

        height: 200px;

        padding-top:0px; 
          

        color:#000000;

        margin-top:0px;
        margin-bottom:1px;


        }

    

    #ticker {

        position:relative;
                overflow:hidden;
                margin-left:50px;
                margin-right:20px;
                margin-top:25px;
        width:155px;
        padding:0px;
        

    }


        </style>
<!-- SLIDER START -->
    <script type="text/javascript" src="robin/easyslider/js/jquery.js"></script>
    <script type="text/javascript" src="robin/easyslider/js/easySlider.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){    
            $("#ticker").easySlider({
                auto: true, 
                continuous: true
            });
        });    
    </script>
    
<link href="robin/easyslider/css/screen.css" rel="stylesheet" type="text/css" media="screen" />
</script>
</head>
<body>
<div id="ticker-container">

        <div id="ticker">  
<ul>                
               <?php
                        
include("robin/notice/config.php");
                        
$query "SELECT id, title,body,name FROM notice";
                        
$result mysql_query($query);
                        
$num mysql_num_rows($result);
                        while (
$row mysql_fetch_assoc($result))
                        {  
$name $row['name'];
                             echo 
'<li><a href="robin/notice/fullarticle.php?id='.$row["id"].'" rel="popup standard 700 600 noicon"><img src="kcfinder/upload/.thumbs/images/'.$name.'" width="150px" height="150px"  /></a></li>';
                             
                        }
                
?>
            </ul>
        </div>

        </div>
</body>
</html>
please help
shakac is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 09:46 AM.


Advertisement
Log in to turn off these ads.