從右到左滑動（不工作）

我想知道爲什麼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

從右到左滑動（不工作）

回答

相關問題