简体   繁体   中英

JavaScript slider

I added three sliders, but combining all 3 slider in html page two of it working, but while checking individually all three working. is it any mistake in which the script placed,,help me pllz?

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="deco.css" rel="stylesheet" type="text/css" />

<!--[if IE 6]>
<link rel="stylesheet" href="ie6.css" type="text/css" charset="utf-8">
<![endif]-->
<!--[if IE 7]>
   <link rel="stylesheet" href="ie7.css" type="text/css" charset="utf-8">
<![endif]-->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="s3Slider.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#slider1').s3Slider({
            timeOut: 3000 
        });
    });
</script>
<script type="text/javascript">
var image1=new Image()
image1.src="images/slide1.png"
var image2=new Image()
image2.src="images/slide2.png"
var image3=new Image()
image3.src="images/slide3.png"

</script>

<script type="text/javascript" src="jso/jquery.js"></script>
        <script type="text/javascript" src="jso/jquery.innerfade.js"></script>
    <script type="text/javascript">
       $(document).ready(
                function(){
                    $('#testim').innerfade({
                        animationtype: 'slide',
                        speed: 750,
                        timeout: 4000,
                        type: 'random',
                        containerheight: '102px'
                    });

            });
    </script>   

<script type="text/javascript" src="floating-1.7.js">  
</script>

<script type="text/javascript">  
    floatingMenu.add('floatdiv',  
        {  
            // Represents distance from left or right browser window  
            // border depending upon property used. Only one should be  
            // specified.  
            // targetLeft: 0,  
            targetRight: 10,  

            // Represents distance from top or bottom browser window  
            // border depending upon property used. Only one should be  
            // specified.  
            targetTop: 118,  
            // targetBottom: 0,  

            // Uncomment one of those if you need centering on  
            // X- or Y- axis.  
            // centerX: true,  
            // centerY: true,  

            // Remove this one if you don't want snap effect  
            snap: true  
        });  
</script> 

</head>

<div id="floatdiv">  

<div class="social">
    <!--- Flottting slider--->   
</div>  
 </div> 

<body id="home1" style="margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- ImageReady Slices (hjgy.psd) -->
<div class="wrapper">

    <div id="middle">
        <div class="slide">

<!-- JavaScripts-->

    <div id="slider1">
     <!-- // slider -->
    </div>
        </div>
        <div class="latest">
               <div class="testimonal">
                    <!-- // slider -->  

                </div>  
        </div>
     </div>

    <div id="footer">
    </div>
    <div style="clear:both"></div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>

At first, try to move slider inside the body tag. HTML doesn't like tags between body and head tags.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM