Opening Shadowbox from javascript function

问题

I'm trying to open Shadowbox from within a radio button onclick event on a asp.net web form without success. I was initially opening it using a button click which worked fine, but now need to make sure it happens when the radio button option is selected. I then tried to click the button in javascript (button.click()), but that only worked in IE and Newer versions of firefox. So I have opted to use Shadowbox.open, but it is causing some issues. Here is my code:

if (yes.checked == true)
    {            
        var url = 'http://localhost:52963/items.aspx';
        Shadowbox.open( { content:    url, 
                        type:        "iframe", 
                        title:         "sbTitle ", 
                        options:   {   initialHeight:350, 
                                        initialWidth:450, 
                                        loadingImage:"loading.gif", 
                                        handleUnsupported:  'link' 
                                    } 
                     }); 
    }

This just seems to bring up the overlay but doesn't open the web page inside it. Anyone know where I'm going wrong?

回答1:

Apparently I needed to add a player as well as a type. So the amended code is this:

Shadowbox.open( { content:    url, 
                    type:        "iframe", 
                    player:      "iframe",
                    title:         "sbTitle ", 
                    options:   {   initialHeight:350, 
                                    initialWidth:450, 
                                    loadingImage:"loading.gif", 
                                    handleUnsupported:  'link' 
                                } 
                 });

回答2:

I had a lot of trouble with this, I tried firing click using .trigger('click') from jquery , but that didnt work in chrome (worked in firefox)

Turns out the answer is pretty simple, similar to e-on answer, but dialed down.

Your images are in a normal shadowbox gallery

<div class="gallery">
  <a  href="/img1.jpg" rel="shadowbox[gallery1]" >
    <img id="Image0" src="/img1.jpg" />
  </a>
  <a  href="/img2.jpg" rel="shadowbox[gallery1]" >
    <img id="Image1" src="/img2.jpg" />
  </a>
</div>

Then your clickable link

<a href="#" class="galleryLauncher" gallery="gallery1">Click to view all images</a>

I wired up the clickable link via jquery in a document.ready call

$('.galleryLauncher').click(function () {

 //gallery to launch
    var id = $(this).attr('gallery');

 //get the first item out of the cache
    var content = Shadowbox.cache[1].content;

 //default options object
    var options = {}; 

 //now we can open it
    Shadowbox.open({
        content: content,
        player: "img",
        gallery: id,
        options: options
    });

    return false;
});

来源：https://stackoverflow.com/questions/6571936/opening-shadowbox-from-javascript-function

标签

javascript

ASP.NET

shadowbox