JQuery слайд при нажатии кнопки

Question

Я сделал скрипку , чтобы объяснить мою проблему

То, что я хочу, это скользить в div newScreen, пока div fullScreen становится меньше.Действия запускаются нажатием run .

Но как вы видите, новый экран не отображается.

Кто-то может сказать мне, что делать?* Спасибо!

Answer 1

Определенно, возникнет проблема со следующей строкой кода без ссылки на 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

Answer 2

Я обновил ваш код ..

check Fiddle

Вы забыли загрузить jquery-ui.js

Answer 3

Чтобы использовать анимацию слайдов, вам нужно включить некоторые элементы пользовательского интерфейса jQuery ... тогда ваш код работает просто отлично:

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

Answer 4

Вы пытаетесь использовать 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>