How to align links, videos, photos properly
If I click on any part of sign out row I got sign out and have some more issue like this.
I am not able to align links,videos,photos etc in right way. For example I have aligned sign out on right side page but when i click on any area which falls in the row area (in which sign out is placed), I got sign out but I want when I click only on link I get sign out.
I have used photos in my pages and videos. I have plac开发者_Python百科ed photos in a table in less than half of page width. I want that in remaining half area videos player appreas. But I am not able to do this.
I am sending you my files please check and tell me correct method to align these things I think Div will be used but I don't know if this is prooper use. Please suggest me what should I do.
Home_page.php
<html>
<head>
<title>Home Page</title>
</head>
<body background="bg.JPG">
<table>
<tr><td><?php include('search_file.php'); ?></td>
<td><?php include('google.php'); ?></td>
</table>
<font color="red"><b><h2 align="center">Deepak Narwal Welcomes You</h2></b></font>
<hr size="2" width="50%">
<a href="logout_file.php"><h3 align="right">Sign Out</h3></a>
<?php include("photo_upload.php"); ?>
<br /><br /><br /><br />
<?php include("video_upload.php"); ?>
<br /><a href="upload_file.php"><h4>Up-Load Files</h4></a>
<br /><br />
<a href="list_files.php"><h4>List All Up-Loaded Files</h4></a>
</body>
</html>
Next file in which i have used photos are
photo_upload.php
<html>
<head>
<script type="text/javascript">
function changeimage(n)
{
var img=document.getElementById("sample");
if(n==1)
{
img.src="16.jpg";
}
else
{
img.src="5.jpg";
}
}
</script>
</head>
<body>
<table cellpadding=10 cellspacing=6 align=left border=1>
<tr>
<td><a href="kat.JPG"><img src="kat.JPG" width="200" height="150" border="0" alt="katrina"></a></td>
<td><a href="kat2.JPG" ><img src="5.jpg" border="0" width="200" height="150" id ="sample" alt="sample" onmouseover="changeimage(1)" onmouseout="changeimage(2)"></a></td>
</tr>
<tr>
<td><a href="kat3.JPG"><img src="kat3.JPG" width="200" height="150" border="0"></a></td>
<td><a href="kat4.JPG"><img src="kat4.JPG" width="200" height="150" border="0"></a></td>
</tr>
</table>
</body>
</html>
For videos my file is
video_upload.php
<html>
<head>
<script src="flowplayer-3.1.4.min.js"></script>
</head>
<body>
<a
style="display:block;width:300px;height:250px;position:relative;left:1054;"
id="player">
</a>
<script language="JavaScript">
flowplayer("player", "flowplayer-3.1.5.swf" , { clip: { autoPlay : false, autoBuffering: true}, playlist: [ 'video.flv', 'flowplayer.flv'] }); //create a object of clip name
</script>
<br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br />
<object classid="clsid:67DABFBF-D0AB-41fa-9C46-CC0F21721616" align="right" width="320" height="260" codebase="http://go.divx.com/plugin/DivXBrowserPlugin.cab">
<param name="custommode" value="none" />
<param name="loop" value="true" />
<param name="autoPlay" value="false" />
<param name="autoBuffering" value="true" />
<param name="src" value="http://localhost/idiot.mkv" />
<embed type="video/divx" src="http://localhost/idiot.mkv" custommode="none" width="300" height="250" previewImage="deepak.JPG" loop="true" autoPlay="false" pluginspage="http://go.divx.com/plugin/download/">
</embed>
</object>
</body>
</html>
Tell me how I can align pics in half width area and videos in next half width area in same rows.
First of all you have to get rid of the <html>
, <head>
, and <body>
tags in video_upload.php
and photo_upload.php
.
You are including these files into your main HTML page! This already has those tags. You cannot have an html
tag inside the body
tag again.
You should read about the structure of HTML documents.
And for the layout, well it is hard to tell without actually seeing how it looks like. Maybe you want to ask at doctype.com as this question is more about design.
精彩评论