.sliderImage对象没有适用的方法

时间:2013-06-14 06:45:07

标签: jquery html css

我在我的图片滑块代码中使用jquery 1.7.2,我在控制台中出现以下错误,我不明白为什么???

HTML code:

    <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>iSlider</title>
        <meta name="robots" content="index, follow, noarchive" />

        <!-- CSS  -->
        <link rel="stylesheet" href="css/style.css" type="text/css" /> 
        <link rel="stylesheet" href="css/iSlider.css" type="text/css" />

        <!-- JS  -->
        <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
        <!--    <script type="text/javascript" src="js/jquery.js"></script> -->
        <script type="text/javascript" src="js/jquery.ui.touch-punch.js"></script>
        <script type="text/javascript" src="js/jquery-css-transform.js"></script>   
        <script type="text/javascript" src="js/rotate3Di.js"></script>

        <script type="text/javascript">

            var imgFront=new Array();
            var n=0;
            var backimg=new Array();
            var frontimg=new Array();
            var imgArr = new Array();
            var bgImg = new Array();
            var arrBackImg = new Array();
            var  frontText = new Array();
            var backText  =new Array();
            var eventChk="";
            var i = 1;
            var ua = navigator.userAgent; 
            var clickEvent = (ua.match(/iPad/i)) ? 'touchstart' : 'click';
            var isTouchSupported = "ontouchend" in document

            $(document).ready(function () {
                $('#myImageFlow').on('click touchstart',".sliderImage",  touchStart());
            });
        </script>

    </head>
    <body style="background-image:url('img/Mesh2.png');background-repeat:no-repeat; background-size: cover; width:'100%'">
        <h1>iSlider</h1>

        <!-- This is all the XHTML ImageFlow needs -->
        <div id="myImageFlow" class="imageflow">

            <div id="id1" alt='div1' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img1.jpg'); border:solid; border-color: black;">You've styled the div to have a set width of 100px. At a reasonable font size, that's too much text to fit in 100px. Without doing anything, </div>
            <div id="id2" alt='div2' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img2.jpg'); border:solid; border-color: black;">this is 2</div>
            <div id="id3" alt='div3' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img3.jpg'); border:solid; border-color: black;">this is 3</div>
            <div id="id4" alt='div4' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img4.jpg'); border:solid; border-color: black;">this is 4</div>
            <div id="id5" alt='div5' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden; background-image:url('img/img5.jpg'); border:solid; border-color: black;">this is 5</div>
            <div id="id6" alt='div6' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img6.jpg'); border:solid; border-color: black;"> this is 6</div>
            <div id="id7" alt='div7' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img7.jpg'); border:solid; border-color: black;"> this is 7</div>
            <div id="id8" alt='div8' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img8.jpg'); border:solid; border-color: black;">this is 8</div>
            <div id="id9" alt='div9' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img9.jpg'); border:solid; border-color: black;"> this is 9</div> 
            <div id="id10" alt='div10' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img10.jpg'); border:solid; border-color: black;">this is 10</div>
            <div id="id11" alt='div11' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img11.jpg'); border:solid; border-color: black;">this is 11</div>
            <div id="id12" alt='div12' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img12.jpg'); border:solid; border-color: black;">this is 12</div>
            <div id="id13" alt='div13' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img13.jpg');border:solid; border-color: black;">this is 13</div>
            <div id="id14" alt='div14' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img12.jpg'); border:solid; border-color: black;">this is 14</div>
            <div id="id15" alt='div15' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img6.jpg'); border:solid; border-color: black;"> this is 15</div>
            <div id="id16" alt='div16' class="sliderImage" width="300" height="360" onclick="" style="visibility:hidden;background-image:url('img/img7.jpg'); border:solid; border-color: black;"> this is 16</div>

        </div>
    </body>
</html>

未捕获TypeError:对象.sliderImage没有方法'apply'

0 个答案:

没有答案