jQuery的幻燈片時按下按鈕

Question

我做了一個fiddle解釋我的問題

我要的是在div newScreen而DIV全屏正變得越來越小滑動。該操作通過按運行運行。

但是，正如你所看到的newScreen doensn't顯示。

有人可以告訴我該怎麼辦？

謝謝！

Answer 1

您正在嘗試使用jQuery UI動畫。爲了讓你的代碼工作添加下列引用：

<script src="http://ui.jquery.com/latest/ui/jquery.effects.core.js"></script> 
<script src="http://ui.jquery.com/latest/ui/jquery.effects.slide.js"></script> 

Answer 2

我已經更新了你的代碼..

檢查Fiddle

你忘了加載jQuery的ui.js

Answer 3

要使用您需要包含jQuery UI某些元素的幻燈片動畫......然後您的代碼工作得很好：

http://fiddle.jshell.net/LdJjs/22/

Answer 4

當然，沒有JQueryUI引用的下面這行代碼會出現問題。

$('#newScreen').show('slide',{direction: 'right'}, 1000); 

所以首先你需要包含正確的參考。

爲了您的代碼的其餘部分，這一切都很好，但我個人會做這樣的事情：

$(document).ready(function() { 

    $('#newScreen').hide(); 

    $('#addButton').click(function() 
    { 
     $('#fullScreen').animate({"width":"50%"}, 1000, function() { 
      $('#newScreen').show('slide',{direction: 'right'}, 1000); 
     }); 
    }); 
}); 

並請在這裏籤jQueryUI的引用，以及：http://docs.jquery.com/UI/Effects/Slide