代码之家  ›  专栏  ›  技术社区  ›  Dean

Facebook页面javascript:无法重用功能

  •  1
  • Dean  · 技术社区  · 14 年前

    我正在Facebook上创建一个自定义页面,在画布选项卡上使用FBML和JavaScript。

    我想制作一个像你通常使用jquery那样的滑动条,不幸的是,Facebook还没有jquery支持,所以我想我会用普通的老javascript制作这个滑动条。

    使用后 slide() 函数一次,我得到“slide()is not a function”错误 Firebug 慰问。

    代码如下:

    <script>
        <!--
            function slide(reqPos){
                desSlideState = reqPos;
                curSlideState = getCurSlideState();
                toSlide = desSlideState - curSlideState;
                pxToSlide = toSlide * (-520);
    
                movCount = 0;
                timer = setInterval(function(){eSlide(slide, pxToSlide);},100);
            }
            function getCurSlideState(){
                slide = document.getElementById("slider");
                var slideLeft = slide.getStyle("left");
                var slideLeft = parseFloat(slideLeft);
                var slideState = slideLeft/-520;
                return slideState;
            }
            function eSlide(elemToMove, lengthToMove){
                curLeft = elemToMove.getStyle("left");
                curLeft = parseFloat(curLeft);
    
                newLeft = curLeft + (lengthToMove/10);
                elemToMove.setStyle("left", newLeft + "px");
    
                movCount++;
    
                if(movCount == 10){
                    clearInterval(timer);
                    return false;
                }
            }
        //-->
    </script>
    
    <div id="fb-wrapper">
        <h1>Loads Solutions LTD</h1>
    
        <div class="loads-nav-wrap">
    
          <div class="fb-nav" id="nav1"><a href="http://www.loads.co.il/hosting.php" onclick="slide(0); return false;">Server<br />Hosting</a><div></div></div>
    
          <div class="fb-nav" id="nav2"><a href="http://www.loads.co.il/dedicated.php" onclick="slide(1); return false;">Dedicated<br />Servers</a><div></div></div>
    
          <div class="fb-nav" id="nav3"><a href="http://www.vcp.co.il/" onclick="slide(2); return false;">Web Design<br />&Development</a><div></div></div>
    
          <div class="fb-nav" id="nav4"><a href="http://www.loads.co.il/vps.php" onclick="slide(3); return false;">VPS</a><div></div></div>
    
          <div class="fb-nav" id="nav5"><a href="http://www.loads.co.il/exchange.php" onclick="slide(4); return false;">Exchange MailBoxes</a><div></div></div>
    </div>
    
    <div id="content-slide">
        <div id="slider" style="left:0">
            <div class="slide-content">
                <h3 id="test-id">content1</h3>
            </div>
            <div class="slide-content">
                <h3>content2</h3>
            </div>
            <div class="slide-content">
                <h3>content3</h3>
            </div>
            <div class="slide-content">
                <h3>content4</h3>
            </div>
            <div class="slide-content">
                <h3>content5</h3>
            </div>
        </div>
    </div>
    

    不要担心HTML无效,否则Facebook画布将无法工作。

    1 回复  |  直到 14 年前
        1
  •  5
  •   Nick Craver    14 年前

    slide

    slide = document.getElementById("slider");
    

    var

    var slide = document.getElementById("slider");
    

    推荐文章