...

View Full Version : Need help displaying images



Bear1l
05-28-2009, 04:36 AM
I have multiple Quicktime videos that I am displaying on a webpage. I used Quicktime Pro and exported the video for website. It has instructions and coding. I inserted the css in the heading and then copied the script for each video in the body. The problem is that they display vertically, only one per row. I would like to have 4 or 5 per row. For example, in html, I would use a "center" attribute and then have multiple jpg's and they would automatically fill each row according to browser size. How can I do this with videos? I am attaching the Quicktime "read me" file and my web page file.

Thanks in advance for any help.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-US">

<head>

<title>Vids</title>
<script src="http://www.apple.com/library/quicktime/scripts/ac_quicktime.js" language="JavaScript" type="text/javascript"></script>
<script src="http://www.apple.com/library/quicktime/scripts/qtp_library.js" language="JavaScript" type="text/javascript"></script>
<link href="http://www.apple.com/library/quicktime/stylesheets/qtp_library.css" rel="StyleSheet" type="text/css" />
p {display: inline}
div {display: none}

</head>

<BODY> <body background="images/carbg.jpg" bgcolor="#efefe6">


<script type="text/javascript"><!--
QT_WritePoster_XHTML('Click to Play', '1-poster.jpg',
'1.mov',
'320', '256', '',
'controller', 'true',
'autoplay', 'true',
'bgcolor', 'black',
'scale', 'aspect');
//-->
</script>
<noscript>
<object width="320" height="256" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="1-poster.jpg" />
<param name="href" value="1.mov" />
<param name="target" value="myself" />
<param name="controller" value="false" />
<param name="autoplay" value="false" />
<param name="scale" value="aspect" />
<embed width="320" height="256" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"
src="1-poster.jpg"
href="1.mov"
target="myself"
controller="false"
autoplay="false"
scale="aspect">
</embed>
</object>
</noscript>

<script type="text/javascript"><!--
QT_WritePoster_XHTML('Click to Play', '2-poster.jpg',
'2.mov',
'320', '256', '',
'controller', 'true',
'autoplay', 'true',
'bgcolor', 'black',
'scale', 'aspect');
//-->
</script>
<noscript>
<object width="320" height="256" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="2-poster.jpg" />
<param name="href" value="2.mov" />
<param name="target" value="myself" />
<param name="controller" value="false" />
<param name="autoplay" value="false" />
<param name="scale" value="aspect" />
<embed width="320" height="256" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"
src="2-poster.jpg"
href="2.mov"
target="myself"
controller="false"
autoplay="false"
scale="aspect">
</embed>
</object>
</noscript>

<script type="text/javascript"><!--
QT_WritePoster_XHTML('Click to Play', '3-poster.jpg',
'3.mov',
'320', '256', '',
'controller', 'true',
'autoplay', 'true',
'bgcolor', 'black',
'scale', 'aspect');
//-->
</script>
<noscript>
<object width="320" height="256" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="3-poster.jpg" />
<param name="href" value="3.mov" />
<param name="target" value="myself" />
<param name="controller" value="false" />
<param name="autoplay" value="false" />
<param name="scale" value="aspect" />
<embed width="320" height="256" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"
src="3-poster.jpg"
href="3.mov"
target="myself"
controller="false"
autoplay="false"
scale="aspect">
</embed>
</object>
</noscript>

<script type="text/javascript"><!--
QT_WritePoster_XHTML('Click to Play', '4-poster.jpg',
'4.mov',
'320', '256', '',
'controller', 'true',
'autoplay', 'true',
'bgcolor', 'black',
'scale', 'aspect');
//-->
</script>
<noscript>
<object width="320" height="256" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="4-poster.jpg" />
<param name="href" value="4.mov" />
<param name="target" value="myself" />
<param name="controller" value="false" />
<param name="autoplay" value="false" />
<param name="scale" value="aspect" />
<embed width="320" height="256" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"
src="4-poster.jpg"
href="4.mov"
target="myself"
controller="false"
autoplay="false"
scale="aspect">
</embed>
</object>
</noscript>

<script type="text/javascript"><!--
QT_WritePoster_XHTML('Click to Play', '5-poster.jpg',
'5.mov',
'320', '256', '',
'controller', 'true',
'autoplay', 'true',
'bgcolor', 'black',
'scale', 'aspect');
//-->
</script>
<noscript>
<object width="320" height="256" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="5-poster.jpg" />
<param name="href" value="5.mov" />
<param name="target" value="myself" />
<param name="controller" value="false" />
<param name="autoplay" value="false" />
<param name="scale" value="aspect" />
<embed width="320" height="256" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"
src="5-poster.jpg"
href="5.mov"
target="myself"
controller="false"
autoplay="false"
scale="aspect">
</embed>
</object>
</noscript>

</a>
<P>

</BODY>
</HTML>


Bear1l is online now Add to Bear1l's Reputation Report Post Edit/Delete Message

Old Pedant
05-28-2009, 06:29 AM
A couple of things to try:

It's possible (probable) that the natural display style for an <object> or <embed> is block, so you could try changing them to display: inline.

That is:


<object style="display: inline" ...>
<embed style="display: inline" ...>

But the other obvious thing to do is to put each one of the objects inside a <div> and then use standard div-positioning tricks.

If you get desparate, you could even use a <table> and put each inside a <td> of a <tr> row.

But I'm a little curious as to how you are going to put 4 objects each 320 pixels wide on the same "line". That 1280 pixels, and by far the most common screen size nowaday is 1024x768, which means most people would have to scroll horizontally to see 4 of them...let alone 5.

Oh, and what's that dangling </a> just before the </body> for??

Edit: Just noticed that you only actually use the <object> or <embed> when the browser doesn't support javascript. You really care about people who turn off JS?? Ahh, well...

Since in the normal course of events (98% of users) you will be generating the HTML via the JavaScript calls in there, you clearly need to enclose each set of code in a <div> or <td>.

Old Pedant
05-28-2009, 06:30 AM
Why do I get the feeling that you copy/pasted your message from some other forum??

Could it possibly be this at the bottom of the post:
Bear1l is online now Add to Bear1l's Reputation Report Post Edit/Delete Message
Tch!

Bear1l
05-28-2009, 09:30 PM
Yes. This was copied. I thought I posted in the wrong place since I had no response.

I'm very new to java. I did not need the "no script", good catch, eliminated half the coding.

Tables, which I am familiar with worked great.

Thanks again for your time.

Philip M
05-29-2009, 08:45 AM
Yes. This was copied. I thought I posted in the wrong place since I had no response.

I'm very new to java. I did not need the "no script", good catch, eliminated half the coding.

Tables, which I am familiar with worked great.

Thanks again for your time.


Be aware that Java and Javascript are entirely different programming languages, in spite of the confusingly similar names.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum