问题描述
我正在尝试使用 ext js 4.2.2 版本显示图像。当我尝试将鼠标悬停在现有图像上时,它应该在现有图像上显示一个图标(另一个小图像)并模糊背景以删除图像。我在下面尝试过,但不确定如何在现有图像上渲染图标图像。
Ext.application({
name: 'fiddle',launch: function () {
var me = this;
myWindow = Ext.create('Ext.window.Window',{
title: 'Test Component animation',width: 500,height: 300,layout: {
type: 'hBox',align: 'stretch'
},items: [{
xtype: 'image',flex: 0.12,height: '80px',width: '80px',margin: '0 10 0 0',src: '',//existing image src
itemId: 'image',style: {
'cursor': 'pointer'
},listeners: {
render: function (f) {
this.getEl().on('mouSEOver',function () {
this.animate({
to: {
opacity: 0.2
},listeners: {
afteranimate: function () {
me.mouserOverFunction(f);
},scope: this
}
});
});
this.getEl().on('mouSEOut',function () {
this.animate({
to: {
opacity: 1
},listeners: {
beforeanimate: function () {
me.mouSEOutFunction(f);
},scope: this
}
});
});
}
}
}]
});
},mouserOverFunction: function (f) {
f.setSrc('');//new image src
},mouSEOutFunction: function (f) {
// My custom logic
f.setSrc('');//old image src
}
});
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)