我正在尝试在其中放大带有HTML的Panel。
Ext.define('Sencha.view.Detail_content', {
extend: 'Ext.Panel',
xtype: 'detailcontenttpl',
config: {
layout: { type: "fit" },
scrollable: true,
styleHtmlContent: true,
id: 'detail_content_wrap',
tpl : [
"<p class='detail_contentDate'>{date}</p>",
"<div class='messageWrap'>{message}</div>"
],
listeners: {
pinchstart: {
element: 'innerElement',
fn: function(e, t) {
this.startScale = e.scale;
}
},
pinch: {
element: 'innerElement',
fn: function(e, t) {
e.preventDefault();
this.scale = e.scale * this.startScale;
var p = t.parentNode;
Ext.fly(p).setStyle('-webkit-transform', 'scale('+this.scale+')');
}
}
}
}
});
它有点工作,但不能按预期工作。它会破坏滚动条,并且它不会一直有效。
我在想Ext.fly(p).setStyle('-webkit-transform', 'scale('+this.scale+')');
应该设置其他内容,但我已尝试过每个父元素,但仍然失败。
我知道有一些可用的例子,但大多数都处理图像,而不是面板与HTML。
我做错了什么?