как использовать jquery и sencha touch2 вместе.? - PullRequest
Новая
       2

как использовать jquery и sencha touch2 вместе.?

1 голос
/ 21 февраля 2012

Я разработал экраны sencha touch2 и после этого добавляю файл jquery для animate() по щелчку, но он не работает должным образом. 

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
    <title>slider</title> 
     <link href="im.css" rel="stylesheet" type="text/css" />                          
    <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/touch/sencha-touch-designer-edition/builds/resources/css/sencha-touch.css"/>
    <script type="text/javascript" src="http://extjs.cachefly.net/touch/sencha-touch-designer-edition/builds/sencha-touch-all-debug.js"></script>
    <script type="text/javascript" src="designer.js"></script>  
     <script type="text/javascript" src="jquery-1.3.1.js"></script>
        <script type="text/javascript">
        jQuery.noConflict();
            jQuery(document).ready(function(){
                            var currentState = 1;
                            jQuery('#capimage').click(function(){
                               if(currentState == 1){
                    jQuery('.cover').stop().animate({width:'118px'},{queue:false,duration:160});
                                        currentState = 2;
                                    }
                                    else{
                                        jQuery('.cover').stop().animate({width:'5px'},{queue:false,duration:160});
                                    }
                            });

            });
        </script>    
</head>
<body></body>
</html>

, когда я удаляю designer.js, онбудет работать. Пожалуйста, помогите найти решение.

1 Ответ

0 голосов
/ 21 февраля 2012

Привет вот пример с 3 экранами, которые скользят: 

/**
 * Your app description
 */
Ext.application({
    name: 'Slide my card',
    // launch function
    launch: function() {
        Ext.create('Ext.Container', {
            fullscreen: true,
            layout: {
                type: 'card',
                animation: {
                    type: 'slide',
                    direction: 'left'
                }
            },
            items: [
                {
                    xtype: 'panel',
                    html: 'Card 1',
                    items : [{
                        xtype : 'button',
                        text: 'Go to second card',
                        margin: '10 10 10 10',
                        ui : 'action',
                        handler: function() {
                            this.getParent().parent.setActiveItem(1)
                        }
                    }]
                },
                {
                    xtype: 'panel',
                    html: 'Card 2',
                    items : [{
                        xtype : 'button',
                        text: 'Go to third card',
                        margin: '10 10 10 10',
                        ui : 'action',
                        handler: function() {
                            this.getParent().parent.setActiveItem(2)
                        }
                    }]
                },
                {
                    xtype: 'panel',
                    html: 'Card 3',
                    items : [{
                        xtype : 'button',
                        text: 'Go to first card',
                        margin: '10 10 10 10',
                        ui : 'confirm',
                        handler: function() {
                            this.getParent().parent.setActiveItem(0)
                        }
                    }]
                }
            ]
        });
    }
});
...