Questions

Answer

How to use Shadowbox with a flash component

First, download and install Shadowbox (possibility to pop-up images, videos and SWFs) using their tutorial.

Next, in your images.xml file at the url (or link for some components) attribute try to specify something like this:

url="javascript:LaunchShadowbox('images/01.jpg','img','First Image')" target="_self"

Also in your HTML file that embeds the SWF you'll have to write the following JavaScript code between the <head></head> tags:

<script type="text/javascript">
function LaunchShadowbox(url,player,title){
Shadowbox.init();
Shadowbox.open({content: url, player: player, title:title});
}
</script>

Note that the Mediabox will not work if tested locally. You’ll have to test it on a HTTP server.

Comments

  • Page:
  • 1
  • 2
  • 3
  • 4
  • 5
  • >
  • loading comments...

Another Mike

Posted 6 years ago

Hi,

I am trying to get shadowbox to work with ContactFormFX. I see where you say shadowbox only works with images, but shadowbox says it works works with .swf. Does this mean that only image-based FlshXML compnonts work with shadowbox, but ContactFormFX does not? If not, do have simple code to popup ContactFormFX like on your Components page?

Thanks,
Mike.

FlashXML Support

Send us the link to your website so we can check what you’ve done so far. You have to use the install instructions from the Shadowbox’s official page to pop up a SWF because what we explain in this article is how to pop-up larger images when you click on a image inside one of our products.

Mike

Posted 6 years ago

I’m tryign to use shadowbox with the 3DCarousel Menu AS2 FX. I can’t seem to get it to work.. I double checked all spelling and everything else I could think of. I have this in my <head>:
</script>
<link rel=“stylesheet” type=“text/css” href=“shadowbox.css”>
<script type=“text/javascript” src=“shadowbox.js”></script>
<script type=“text/javascript”>
Shadowbox.init({ handleOversize: “drag”, modal: true
});
</script>
<script type=“text/javascript”>
function LaunchShadowbox(url,player,title){
Shadowbox.init();
Shadowbox.open({content: url, player: player, title:title});
}

And this is my image.xml:
<Carousel centeredImage=“images/mtm_logo.png” url=“http://www.michaelmerion.com” target=”_blank”>
<photo image=“images/Camera_A_thmb.jpg” url=“javascript:LaunchShadowbox(‘images/Camera_A.jpg’,‘img’,‘Camera A’)” target=”_self”><![CDATA[Camera A]]></photo>
<photo image=“images/Strong_man_thmb.jpg” url=“javascript:LaunchShadowbox(‘images/Strong_man.jpg’,‘img’,‘First Image’)” target=”_self”>Click Here</photo>
<photo image=“images/06.jpg” url=“http://www.flashxml.net” target=”_blank”><![CDATA[]]></photo>
<photo image=“images/07.jpg” url=“http://www.flashxml.net” target=”_blank”><![CDATA[]]></photo>
</Carousel>

FlashXML Support

You only modified the URL with the LaunchShadowbox function for two images and for image Camera_A_thmb.jpg works for sure (checked with Chrome, IE9, FF11). For the other image Strong_man_thmb.jpg the shadowbox function works but the image it’s not loaded because the image it tries to open has jpg extension in the images.xml file but the real extension of that image is JPG. There’s a difference between jpg and JPG on Linux/Unix servers. Add the LaunchShadowbox function to all your images just as you did with the two images that already have the function added and make sure that you use the correct path for the images and it will work.

igorlaszlo

Posted 6 years ago

Hello,

i would like to use your customizable grid gallery in my wordpress web site (self hosted). I added the script to the header.php, then i do not understand where to add the url=“javascript…. in the thumbs.xml or in the big.xml ?
Also it is not clear which image (thumb or big) that i must add in the url…

I tried to add the code like this (jpg is the thumb and swf is the big) :

<photo image=“http://www.igorlaszlo.com/thumbs/sc3961.jpg” url=“javascript:LaunchShadowbox(‘http://www.igorlaszlo.com/images/sc3961.swf’,‘swf’,‘Album: Teddy tale – Ref. sc3961’)” target=”_self”>
<![CDATA[<head>Album : Teddy Tale<br>Ref. sc3961</head>]]></photo>

It does not work, nor i add it to thumbs.xml, neighter in the big.xml…

Thansk for your kind reply in advance !
Igor

FlashXML Support

Hi,

Please provide a link to the webpage where you are testing the Shadowbox script, in your Gallery. However, keep in mind that our Galleries can display SWF files directly, via the big.xml file.

nick Pledge

Posted 6 years ago

Many Thanks for spotting what I was missing. I now have the images opening up on click. The Shadowbox site suggests I should be able to scroll through the large images (pervious/next). Cant seem to find the right code or where to place it.!!

My images.xml looks like this:
<images> <photo image = “images/fully_clad2.jpg” url=“javascript:LaunchShadowbox(‘doorsCF/images/fully_clad2_lge.jpg’,‘img’,‘Fully Clad Doorset’)” target=”_self”><![CDATA[<head>Fully Clad Doorset</head>]]></photo> <photo image = “images/fully_clad2.jpg” url=“javascript:LaunchShadowbox(‘doorsCF/images/fully_clad2_lge.jpg’,‘img’,‘Second Image’)” target=”_self”><![CDATA[<head>Fully Clad Doorset</head>]]></photo> <photo image = “images/fully_clad2.jpg” url=“javascript:LaunchShadowbox(‘doorsCF/images/fully_clad2_lge.jpg’,‘img’,‘Third Image’)” target=”_self”><![CDATA[<head>Fully Clad Doorset</head>]]></photo> <photo image = “images/fully_clad2.jpg” url=“javascript:LaunchShadowbox(‘doorsCF/images/fully_clad2_lge.jpg’,‘img’,‘Fourth Image’)” target=”_self”><![CDATA[<head>Fully Clad Doorset</head>]]></photo>

</images>

Would appreciate your help on this. Once site is ready we will be purchasing correct licence.

Thanks
Nick

FlashXML Support

Hi,

Unfortunately is not possible to create an image set with shadobox, for that you could use Lightbox or Colorbox (colorbox is already implemented with this component). Please check the live demo from the product’s page, you have to check the colorbox button.

Nick Pledge

Posted 6 years ago

Hi, I am trying to integrate either Lightbox or Shadowbox with Clover Flow and not having much joy.

On the link below I have coded for Shadowbox but the cover flow doesn’t work.

The Coverflow was working fine before I added the Shadowbox code!!

I’m sure its me being stupid.. but can you see where i am going wrong? I have four of these to install on the site!!

Thanks
Nick

The image.xml code is…
<images> <photo image = “images/fully_clad2.jpg” url=“javascript:LaunchShadowbox(‘images/fully_clad2_lge.jpg’,‘img’,‘First Image’)” target=”_self”><![CDATA[<head>Fully Clad Doorset</head>]]></photo> <photo image = “images/25.jpg” colorboxImage=“images/25.jpg” url = “http://www.flashxml.net” target=”_blank” colorboxInfo=“Item 05” colorboxClass=“image”><![CDATA[<head>Test them below</head>]]></photo> <photo image = “images/26.jpg” colorboxImage=“images/26.jpg” url = “http://www.flashxml.net” target=”_blank” colorboxInfo=“Item 06” colorboxClass=“image”><![CDATA[<head>You can customize it completely without Flash</head>]]></photo> <photo image = “images/27.jpg” colorboxImage=“images/27.jpg” url = “http://www.flashxml.net” target=”_blank” colorboxInfo=“Item 07” colorboxClass=“image” media=“videos/disco2.flv” mediaImage=“videos/disco2.jpg” skin=“assets/skins/videoSkin1.xml” width=“250” height=“200” autoplay=“false”><![CDATA[<head>only through XML</head>]]></photo> <photo image = “images/28.jpg” colorboxImage=“images/28.jpg” url = “http://www.flashxml.net” target=”_blank” colorboxInfo=“Item 08” colorboxClass=“image”><![CDATA[<head>Complete instructions provided</head>]]></photo> <photo image = “images/29.jpg” colorboxImage=“images/29.jpg” url = “http://www.flashxml.net” target=”_blank” colorboxInfo=“Item 09” colorboxClass=“image”><![CDATA[<head>Very easy to integrate in any website</head>]]></photo> <photo image = “images/30.jpg” colorboxImage=“images/30.jpg” url = “http://www.flashxml.net” target=”_blank” colorboxInfo=“Item 10” colorboxClass=“image”><![CDATA[<head>Even without having Flash installed!</head>]]></photo>
</images>

FlashXML Support

Hi,

The problem is that your embedding code is missing this line:

<script type="text/javascript" src="doorsCF/swfobject.js"></script>

Just add it in the source code after this line:
<!--COVERFLOW HEAD SCRIPT-->

  • loading comments...
  • Page:
  • 1
  • 2
  • 3
  • 4
  • 5
  • >

Do you have a question?

you will get an answer in 24 hours, tops.

(required) Only alphanumeric characters allowed
(required) (will not be published)
Please type a message! Your message is too long! Either try to keep within 1500 characters, or contact our support team via email at support [at] flashxml.net.
(will not be published)
You mistyped the two words!
Can't read? Change the image
Format your comments using Textile: *bold*, _italic_, "link text":address, @code@
Connect to us on Facebook Follow us on Twitter Subscribe to our RSS feed
Copyright © FlashXML.net 2009 - 2019