CODEWITHSUNDEEP
javascriptjqueryshadowbox
Asif Alamgir
Asif Alamgir

Reputation: 1462

Disable shadowbox default loading image

Is there any way where I can disable shadowbox default loading image. We need to show our company loading image only. Right now, it shows shadowbox loading image and then our loading image.

Shadowbox.open({
 content:$("#load_image").html(),
 player:'html',
 width:250,
 height:100,
 options:{modal:true}
});

Thank you

Upvotes: 0

Views: 686

Answers (3)

Dr.Molle
Dr.Molle

Reputation: 117364

The suggestions to modify the css are not bad.

Applying another image only to specific links isn't very difficult.

Give the link where you like to have the company-logo inside the Shadowbox a special className(I will use "foo" in this example)

Use this to initialize the Shadowbox:

Shadowbox.init(
                {
                  onOpen:function(){
                            if($(Shadowbox.gallery[Shadowbox.current].link)
                                .hasClass('foo')){
                                  $('html').addClass('foo');
                                }
                         },
                  onClose:function(){$('html').removeClass('foo');}
                         }
              );

It will check if the clicked link has the special className foo . When it does, it adds this className to the <html>-element.

Now you are able to apply a different image as loading-image to those specific links by using the selector:

html.foo #sb-loading-inner span

Upvotes: 1

Irvin Dominin
Irvin Dominin

Reputation: 30993

If I understand your question correctly you can change the image showed by cahnging the css style in shadowbox.css or override it for the element #sb-loading-inner span

Here is an example fiddle: http://jsfiddle.net/qrMsL/1/

Upvotes: 0

N Rohler
N Rohler

Reputation: 4615

To customize the ShadowBox preloading image, edit the background property in the following line in shadowbox.css:

#sb-loading-inner span{background:url(loading.gif) no-repeat;padding-left:34px;display:inline-block;}

Upvotes: 0

Related Questions