highslide - center hs.loading instead of relative calculation -
i center highslide "loading" this:
.highslide-loading { display: block; position:fixed; top:50%; left:50%; height:32px; width:32px; padding: 24px; margin:-40px 0 0 -40px; text-indent:-9999em; background:#ffffff url(img/hslide_loader_white.gif) 50% 50% no-repeat; -webkit-box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.75); box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.75); -webkit-border-radius: 3px; border-radius: 3px; }
but highslide script puts out inline style this:
element.style { left: 134px; opacity: 0.9; position: absolute; top: -9999px; z-index: 1003; }
i found thread in old support forum, explains how access loading object: http://highslide.com/forum/viewtopic.php?f=1&t=1796&p=7975
hs.expander.prototype.onshowloading = function (sender) { var width = sender.thumbwidth; sender.loading.style.width = width +'px'; };
this works "position" not "top" or "left"
because:
the top , left values set after onshowloading event, can not edited event handler. edit highslide.js file fix this. way set marginleft , margintop loading label, , let highslide top , left.
but - have different usages of highslide script , need keep codebase of highslide.js. margins doesnt me.
i did make custom config script - hs.loading not accessible.
if (typeof(hs) != "undefined") { $.extend(true, hs || {}, { dimmingopacity:0.75, ..., loading: hs.createelement('a', { classname: 'highslide-loading', title: hs.lang.loadingtitle, innerhtml: hs.lang.loadingtext, href: 'javascript:;' }, { position: 'fixed', top: '50%', opacity: hs.loadingopacity, zindex: 1 }, hs.container ) }); }
also in hs.overrides (http://highslide.com/ref/hs.overrides) there no access loader
is there way loader centered in window?
if not - stop investigating ;-)
Comments
Post a Comment