...

View Full Version : Iframe around PHP?



Awesomeness
11-25-2010, 04:07 PM
I have the following code which gets a users pictures next to eachother:


<?php
require 'database2.php';

$email = $_GET['email'];
$user = mysql_query("SELECT * FROM pictures WHERE user = '$email'");
$numRowsUser = mysql_num_rows($user);;

for($count = 1; $count <= $numRowsUser; $count++)
{
$user2 = mysql_fetch_assoc($user);

?>
<img height="100" width="100" style="display:block; float:left" src="upload/<?php echo $user2['picturelink'] ?>">
<?php
}
?>

Now if a user has alot of pictures it will exceed it's screen. So, I thought let's put it in a Iframe. But it does not really work! If I put an Iframe around the whole code it'll create an Iframe with nothing in it. If I just do it around the img tag, it gives me an iframe for each image. But I want all images in 1 iframe, left to eachother.

mlseim
11-25-2010, 04:47 PM
What happens if you do this:



<?php
require 'database2.php';

$email = $_GET['email'];
$user = mysql_query("SELECT * FROM pictures WHERE user = '$email'");
$numRowsUser = mysql_num_rows($user);;

echo "<div style='width:600px; height:120px; overflow:auto;'>";

for($count = 1; $count <= $numRowsUser; $count++)
{
$user2 = mysql_fetch_assoc($user);

?>
<img height="100" width="100" style="display:inline; float:left" src="upload/<?php echo $user2['picturelink'] ?>">
<?php
}

echo"</div>";
?>

Awesomeness
11-25-2010, 05:41 PM
What happens if you do this:



<?php
require 'database2.php';

$email = $_GET['email'];
$user = mysql_query("SELECT * FROM pictures WHERE user = '$email'");
$numRowsUser = mysql_num_rows($user);;

echo "<div style='width:600px; height:120px; overflow:auto;'>";

for($count = 1; $count <= $numRowsUser; $count++)
{
$user2 = mysql_fetch_assoc($user);

?>
<img height="100" width="100" style="display:inline; float:left" src="upload/<?php echo $user2['picturelink'] ?>">
<?php
}

echo"</div>";
?>




Hm almost. It does create a div but I only want a horizontal scroll bar, so what I did was

echo "<div style='width:700px; height:120px; overflow-x: scroll; overflow-y: hidden;'>";

which does remove the Y scroll bar, and has a X scroll bar. Problem is, once all the images reach the divs width, it starts placing it's new images under the old one, while they always have to stay left of each other!

mlseim
11-25-2010, 06:27 PM
I once did an iframe type of thing for this company:
https://secure.dogbark.com/~herndonheald/page.php?p=1&s=2

Is that what you mean?

I don't know if I would use an iframe anymore ... I only did that
because they insisted on it. The clients are always right ... (sigh).

If I had to do it my way, I would have used a JQuery type of horizontal scroll.


==================

If you want to do it the same way I did, let me know.
You have to have a list of your photos in some sort of database, because you
have to loop through the list and calculate the width needed for all of them
within the <div>. If you knew the total width, that would fix the problem
you saw with them stacking underneath when they reached the end.




.

Awesomeness
11-25-2010, 07:03 PM
That is exactly what I mean! But that's where another problem comes in =(

I've got a user uploading his pictures which will be displayed in that bar. The total width depends on the amount of pictures the user will upload, which I do not know =(

mlseim
11-25-2010, 08:28 PM
Actually, you can know what it is.

A PHP script can loop through a bunch of .jpeg files and determine
the width of the photo ... adding them up to get the total width.
PHP can get photo (file info) ... such as width and height.

When your user uploads photos, the photos go into a directory?
And do you also fill a database with the photo filenames, captions, titles, etc?

In reality, you would loop through the photos and get the dimension total.

Here's an example of getting the attributes for one photo ...

example:


<?php

$photo="images/house.jpg";

list($width, $height, $type, $attr) = getimagesize($photo);

echo "The photo is $width pixels wide";

?>



When you use your <iframe>, the iframe size is fixed. Define the width
and height that you want it to appear on for your page. It's the <div>
inside of the <iframe> where you define the variable width ... which would
be the (total width + (number of photos * 20))
... because you might want a spacing of 20 pixels between each photo.


If the photo within the <iframe> is also a link, you adjust the "target=" of the
link to target the parent (or main) page, so it directs the link to the proper
location (outside of the iframe). If you look at my example of the herndonheald
site, you'll notice you can click on the thumbnails within the iframe, and the
full size photo appears in the main page area (outside of the iframe).



.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum