从右到左滑动（不工作）

我想知道为什么JSFIDDLE完美的工作，但在我的服务器，它不起作用。看看下面的下面的代码：从右到左滑动（不工作）

HTML

<div class="project"> 
    <div class="project-col2"> 
     <div class="project-mid-box"> 
      <ul> 
       <a class="myButton"> <li> Project List 1 </li> </a> 
       <a class="myButton"> <li> Project List 2 </li> </a> 
      </ul> 
     </div> 
    </div> 

    <div class="project-col3 myDiv"> 
     <div class="project-mid-box"> 
      <p> HERE </p> 
     </div> 
    </div> 

</div>

CSS

.project {overflow:hidden;} 
.project h3 {color:#FFF;font-weight:normal;} 
.project-col2 {float:left;width:50%;position:relative;} 
.project-col3 {float:left;width:30%;position:relative;} 
.project-mid-box {padding-left:10px;} 
.project-mid-box ul li {border:1px solid #CCC;margin:2px 0;border-radius:5px;padding:5px;line-height:25px;} 
.project-mid-box ul li:hover {background-color:#f7f7f7; 
.myDiv {display:none;}

JS - 我添加了一个功能，因为在的jsfiddle自动添加。

<script type="text/javascript"> 
$(document).ready(function() { 
    $(".myButton").click(function() { 
     // Set the effect type 
     var effect = 'slide'; 
     // Set the options for the effect type chosen 
     var options = { direction: 'right' }; 
     // Set the duration (default: 400 milliseconds) 
     var duration = 700; 
     $('.myDiv').toggle(effect, options, duration); 
    }); 
}) 
</script>

最后，我没有忘记让外部源jQuery库

<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.min.js"> </script>

应该完全工作在我的服务器上，但它不工作。我错过了什么吗？

来源

2014-12-24 Anthosiast

你包括两名jQuery的库，你只需要一个。 –

您正在加载2个主版本的jQuery库，但不包含jQueryUI。 code.jQuery.com上的jQueryUI资源位于ui目录中。

例http://code.jquery.com/ui/1.11.2/jquery-ui.min.js

我可以看到可能出现的混乱，因为有一个共同的版本号，因此，所有你需要的是在/ui/目录添加到你有什么

来源

2014-12-24 04:02:15 charlietfl

我只有UI数据表。我不认为它会受到影响。顺便说一句，你可以仔细检查JSfiddle上面的外部源？如果我不使用相同的来源，这可能是一个问题？因为我正在使用最新的jQuery库。 @charlietfl – Anthosiast

对，但'效果'是jQueryUI。如果你删除，你可以摆脱jQueryUI。看看在控制台中抛出的错误 – charlietfl

你能帮我弄到真正的jQuery让它滑动吗？我使用该链接，它似乎但不滑动。 @charlietfl – Anthosiast

您可以使用2个主要的jQuery所以不工作你的代码。使用一个主要的jQuery 1.11.2然后尝试。

来源

2014-12-24 04:07:16

实际上，因为没有插件注册到第一个版本，奇怪的是有2不会导致页太破或导致任何错误。虽然这是不正确的。第二个版本只会覆盖整个jQuery对象 – charlietfl

使用您在代码调用这个库函数与此相关的库

` <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.js"></script>`

来源

2014-12-24 04:44:29

从右到左滑动（不工作）

回答

相关问题