javascript - jQuery background slideshow -


i'm trying create background slideshow fade effect, i've found script beautifully: http://srobbin.com/jquery-plugins/backstretch/

the problem encounter re-sizes image, disable / remove.

this code:

/*! backstretch - v2.0.3 - 2012-11-30  * http://srobbin.com/jquery-plugins/backstretch/  * copyright (c) 2012 scott robbin; licensed mit */ (function (e, t, n) {     "use strict";     e.fn.backstretch = function (r, s) {         return (r === n || r.length === 0) && e.error("no images supplied backstretch"), e(t).scrolltop() === 0 && t.scrollto(0, 0), this.each(function () {             var t = e(this),                 n = t.data("backstretch");             n && (s = e.extend(n.options, s), n.destroy(!0)), n = new i(this, r, s), t.data("backstretch", n)         })     }, e.backstretch = function (t, n) {         return e("body").backstretch(t, n).data("backstretch")     }, e.expr[":"].backstretch = function (t) {         return e(t).data("backstretch") !== n     }, e.fn.backstretch.defaults = {         centeredx: !0,         centeredy: !0,         duration: 5e3,         fade: 0     };     var r = {         wrap: {             left: 0,             top: 0,             overflow: "hidden",             margin: 0,             padding: 0,             height: "100%",             width: "100%",             zindex: -999999         },         img: {             position: "absolute",             display: "none",             margin: 0,             padding: 0,             border: "none",             width: "auto",             height: "auto",             maxwidth: "none",             zindex: -999999         }     }, = function (n, i, o) {             this.options = e.extend({}, e.fn.backstretch.defaults, o || {}), this.images = e.isarray(i) ? : [i], e.each(this.images, function () {                 e("<img />")[0].src =             }), this.isbody = n === document.body, this.$container = e(n), this.$wrap = e('<div class="backstretch"></div>').css(r.wrap).appendto(this.$container), this.$root = this.isbody ? s ? e(t) : e(document) : this.$container;             if (!this.isbody) {                 var u = this.$container.css("position"),                     = this.$container.css("zindex");                 this.$container.css({                     position: u === "static" ? "relative" : u,                     zindex: === "auto" ? 0 : a,                     background: "none"                 }), this.$wrap.css({                     zindex: -999998                 })             }             this.$wrap.css({                 position: this.isbody && s ? "fixed" : "absolute"             }), this.index = 0, this.show(this.index), e(t).on("resize.backstretch", e.proxy(this.resize, this)).on("orientationchange.backstretch", e.proxy(function () {                 this.isbody && t.pageyoffset === 0 && (t.scrollto(0, 1), this.resize())             }, this))         };     i.prototype = {         resize: function () {             try {                 var e = {                     left: 0,                     top: 0                 }, n = this.isbody ? this.$root.width() : this.$root.innerwidth(),                     r = n,                     = this.isbody ? t.innerheight ? t.innerheight : this.$root.height() : this.$root.innerheight(),                     s = r / this.$img.data("ratio"),                     o;                 s >= ? (o = (s - i) / 2, this.options.centeredy && (e.top = "-" + o + "px")) : (s = i, r = s * this.$img.data("ratio"), o = (r - n) / 2, this.options.centeredx && (e.left = "-" + o + "px")), this.$wrap.css({                     width: n,                     height:                 }).find("img:not(.deleteable)").css({                     width: r,                     height: s                 }).css(e)             } catch (u) {}             return         },         show: function (t) {             if (math.abs(t) > this.images.length - 1) return;             this.index = t;             var n = this,                 = n.$wrap.find("img").addclass("deleteable"),                 s = e.event("backstretch.show", {                     relatedtarget: n.$container[0]                 });             return clearinterval(n.interval), n.$img = e("<img />").css(r.img).bind("load", function (t) {                 var r = this.width || e(t.target).width(),                     o = this.height || e(t.target).height();                 e(this).data("ratio", r / o), e(this).fadein(n.options.speed || n.options.fade, function () {                     i.remove(), n.paused || n.cycle(), n.$container.trigger(s, n)                 }), n.resize()             }).appendto(n.$wrap), n.$img.attr("src", n.images[t]), n         },         next: function () {             return this.show(this.index < this.images.length - 1 ? this.index + 1 : 0)         },         prev: function () {             return this.show(this.index === 0 ? this.images.length - 1 : this.index - 1)         },         pause: function () {             return this.paused = !0,         },         resume: function () {             return this.paused = !1, this.next(),         },         cycle: function () {             return this.images.length > 1 && (clearinterval(this.interval), this.interval = setinterval(e.proxy(function () {                 this.paused || this.next()             }, this), this.options.duration)),         },         destroy: function (n) {             e(t).off("resize.backstretch orientationchange.backstretch"), clearinterval(this.interval), n || this.$wrap.remove(), this.$container.removedata("backstretch")         }     };     var s = function () {         var e = navigator.useragent,             n = navigator.platform,             r = e.match(/applewebkit\/([0-9]+)/),             = !! r && r[1],             s = e.match(/fennec\/([0-9]+)/),             o = !! s && s[1],             u = e.match(/opera mobi\/([0-9]+)/),             = !! u && u[1],             f = e.match(/msie ([0-9]+)/),             l = !! f && f[1];         return !((n.indexof("iphone") > -1 || n.indexof("ipad") > -1 || n.indexof("ipod") > -1) && && < 534 || t.operamini && {}.tostring.call(t.operamini) === "[object operamini]" || u && < 7458 || e.indexof("android") > -1 && && < 533 || o && o < 6 || "palmgetresource" in t && && < 534 || e.indexof("meego") > -1 && e.indexof("nokiabrowser/8.5.0") > -1 || l && l <= 6)     }() })(jquery, window); 

i randomly tried renaming "resize" didn't work out well.

i tried hardly understand question i'm still not sure if understood question correctly, anyway solution if looking keep images in same size every image adding min width , min-height values css style of image, if style of image "img: { }" so:

 img: {             position: "absolute",             display: "none",             margin: 0,             padding: 0,             border: "none",             width: "value",             height: "value",             min-width: "same value",             min-height: "same value",             maxwidth: "none",             zindex: -999999       } 

not sure that's solution understood.


Comments

Popular posts from this blog

.htaccess - First slash is removed after domain when entering a webpage in the browser -

Automatically create pages in phpfox -

c# - Farseer ContactListener is not working -