Movie Gallery

Printable View

Show 40 post(s) from this thread on one page

05-27-2008, 01:43 PM
jadepearl

Hi Medyman!

I think I finally succeeded! I place everything in the same file. Am I correct to say that when I click on the thumbnail, the swf movie will be played in a new page? If that's true, then I finally managed to get it right with this codes.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>

<style text="text/css">
.hide {
display:none;
}
</style>
<script type="text/javascript">

</script>

</head>

<body>

<div id="pool.swf" class="hide">
POOL MOVIE HERE
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="500" height="297">
<param name="movie" value="pool.swf">
<param name="quality" value="high">
<embed src="pool.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="500" height="297"></embed>
</object>
</div>
<div id="condo.swf" class="hide">
CONDO MOVIE HERE
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="500" height="297">
<param name="movie" value="condo.swf">
<param name="quality" value="high">
<embed src="condo.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="500" height="297"></embed>
</object>
</div>
<p><a href="pool.swf"><img src="thumb01.gif" width="75" height="50" border="0" onclick="toggle_visibility('pool.swf);"></a></p>
<p><a href="vmcondo.swf"><img src="thumb02.gif" width="75" height="50" border="0" onclick="toggle_visibility('condo.swf);"></a>
</p>

<p> </p>
</body>
</html>

Thanks so so much! Thank you so much!
I finally learnt something new and understand it.

Question:
May I know what should I do if I want the swf movies to appear on the allocated box on the same webpage?

*Thumbnail 1* * Thumbnail 2*
___________________________

The swf movie will appear in
this box accordingly.

____________________________

Thanks so much! You are an awesome teacher!:)
05-27-2008, 01:54 PM
Medyman

Quote:

May I know what should I do if I want the swf movies to appear on the allocated box on the same webpage?

I'm not sure I know what you mean. They're currently on the same page. Do you mean you want them to show instead of being hidden?

If so, just remove class="hide" from the <div> tag.

Quote:

Thanks so much! You are an awesome teacher!

You're very welcome. Glad to help.

By the way, in IE and Opera you'll notice that the SWF files have this border around them that says "click here to activate". If you want to get rid of that you should use another embedding technique. I recommend SWFObject.

Documentation on SWFObject is here. Examples are here. Code generator is here. FAQs are here.
05-27-2008, 02:06 PM
jadepearl

Hi Medyman,

What I meant was after I pressed F12 to preview in browser, I can see 2 thumbnails on the webpage. When I click on the 1st thumbnail, the swf movie appears in a new webpage.

Thanks so much for your help!
05-27-2008, 02:15 PM
Medyman

Ahh, I see.
That's because you have this:

Code:

<a href="pool.swf"><img src="thumb01.gif" width="75" height="50" border="0" onclick="toggle_visibility('pool.swf);"></a>

You actually don't need the anchors (<a>) because the onClick javascript replicates that functionality. So the above should be:

Code:

<img src="thumb01.gif" width="75" height="50" border="0" onclick="toggle_visibility('pool.swf);">

Similarly, you can get rid of the

Code:

<a href="vmcondo.swf"></a>

as well.
05-27-2008, 02:31 PM
jadepearl

Hi Medyman,

When I remove the the anchors (<a>), somehow, when I clicked on the thumbnails, nothing happens.:confused:

Thanks!:)
05-27-2008, 02:50 PM
Medyman

You're missing closing quotes in the toggle_visibility parameter. Add highlighted:

Code:

<p><img src="thumb01.gif" width="75" height="50" border="0" onclick="toggle_visibility('pool.swf');"></p> <p><img src="thumb02.gif" width="75" height="50" border="0" onclick="toggle_visibility('condo.swf');"></p>

:D
05-27-2008, 02:57 PM
jadepearl

Hi Medyman,

It worked! :)
Yippee!!!! :)
THANK YOU SO MUCH!!!:)

But, the funny thing is:
1) When I click on Thumbnail01, the 1st swf movie will appear above of the thumbnails.
2) When I click on Thumbnail02, the 2nd swf movie will appear below of the 1st swf movie. So, I have 2 swf movies playing simultaneously.
3) When I click on Thumbnail02 again, the 2nd swf movie will disappear and only left the 1st swf movie playing.
4) When I click on Thumbnail02 again, the 1st swf movie will disappear and only left 2 thumbnails images only.

Is this how it should be?

Thanks so much!!!
05-27-2008, 06:38 PM
Medyman

Quote:

Is this how it should be?

As the javascript is now, yes. Bascially the first thumbnail toggles the first SWF, the second thumbnail goggles the second SWF. So you can turn the first SWF off/on with the first thumnail. And same logic goes for the second. They're independent of each other.

If you only want one to show at a time, change

Code:

<script type="text/javascript">  </script>

to

Code:

<script type="text/javascript">  </script>

The highlighted correspond to your HTML div id's. So change them accordingly. I think you're still using .swf in your ids (though, like I said before, that should probably be removed).
05-28-2008, 02:19 AM
jadepearl

Hi Medyman,

Thanks for being so patient and understanding!:)
I have change the codes accordingly and its working beautifully!
You are such a wonderful teacher!
THANKS SO MUCH!!!:)

Show 40 post(s) from this thread on one page