我设计了sencha touch2屏幕,然后在点击时添加animate()
的jquery文件,但它无法正常工作。
<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时,它会工作。请帮助找到解决方案。
答案 0 :(得分:0)
这是一个有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)
}
}]
}
]
});
}
});