X-Git-Url: http://git.roojs.org/?p=roojs1;a=blobdiff_plain;f=docs%2Fsrc%2FRoo_bootstrap_Img.js.html;fp=docs%2Fsrc%2FRoo_bootstrap_Img.js.html;h=dcd960e1683ec8c91fb1d8faa9caa5f9be334a76;hp=370369b38c071c25375124db2e77db76577135a2;hb=5ba88dd4a3a3098a79287438e6aebe26b076010d;hpb=d75026bef72394ce3d2c021d94f5b33a9cfca10b
diff --git a/docs/src/Roo_bootstrap_Img.js.html b/docs/src/Roo_bootstrap_Img.js.html
index 370369b38c..dcd960e168 100644
--- a/docs/src/Roo_bootstrap_Img.js.html
+++ b/docs/src/Roo_bootstrap_Img.js.html
@@ -20,6 +20,7 @@
* @cfg {String} smUrl sm image source
* @cfg {String} mdUrl md image source
* @cfg {String} lgUrl lg image source
+ * @cfg {Boolean} backgroundContain (use style background and contain image in content)
*
* @constructor
* Create a new Input
@@ -36,7 +37,13 @@
* The img click event for the img.
* @param {Roo.EventObject} e
*/
- "click" : true
+ "click" : true,
+ "load" : true
});
};
@@ -51,6 +58,7 @@
smUrl: '',
mdUrl: '',
lgUrl: '',
+ backgroundContain : false,
getAutoCreate : function()
{
@@ -123,12 +131,20 @@
tag: 'img',
cls: (this.imgResponsive) ? 'img-responsive' : '',
html : null,
- src : 'about:blank' src : Roo.BLANK_IMAGE_URL };
+ if (this.backgroundContain) {
+ cfg.cls += ' background-contain';
+ }
+
cfg.html = this.html || cfg.html;
- cfg.src = this.src || cfg.src;
+ if (this.backgroundContain) {
+ cfg.style="background-image: url(" + this.src + ')';
+ } else {
+ cfg.src = this.src || cfg.src;
+ }
if (['rounded','circle','thumbnail'].indexOf(this.border)>-1) {
cfg.cls += ' img-' + this.border;
@@ -161,6 +177,12 @@
if(!this.href){
this.el.on('click', this.onClick, this);
}
+ if(this.src || (!this.xsUrl && !this.smUrl && !this.mdUrl && !this.lgUrl)){
+ this.el.on('load', this.onImageLoad, this);
+ } else {
+ this.el.select('img', true).on('load', this.onImageLoad, this);
+ }
},
@@ -169,6 +191,12 @@
Roo.log('img onclick');
this.fireEvent('click', this, e);
},
+ onImageLoad: function(e)
+ {
+ Roo.log('img load');
+ this.fireEvent('load', this, e);
+ },
+
this.src = url;
if(this.src || (!this.xsUrl && !this.smUrl && !this.mdUrl && !this.lgUrl)){
- this.el.dom.src = url;
+ if (this.backgroundContain) {
+ this.el.dom.style.backgroundImage = 'url(' + url + ')';
+ } else {
+ this.el.dom.src = url;
+ }
return;
}