Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Nov 2010
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Iframe around PHP?

    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.

  • #2
    Master Coder
    Join Date
    Jun 2003
    Location
    Cottage Grove, Minnesota
    Posts
    9,500
    Thanks
    8
    Thanked 1,089 Times in 1,080 Posts
    What happens if you do this:

    PHP Code:
    <?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>";
    ?>

  • #3
    New Coder
    Join Date
    Nov 2010
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by mlseim View Post
    What happens if you do this:

    PHP Code:
    <?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!

  • #4
    Master Coder
    Join Date
    Jun 2003
    Location
    Cottage Grove, Minnesota
    Posts
    9,500
    Thanks
    8
    Thanked 1,089 Times in 1,080 Posts
    I once did an iframe type of thing for this company:
    https://secure.dogbark.com/~herndonh...ge.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.




    .
    Last edited by mlseim; 11-25-2010 at 06:44 PM.

  • #5
    New Coder
    Join Date
    Nov 2010
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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 =(

  • #6
    Master Coder
    Join Date
    Jun 2003
    Location
    Cottage Grove, Minnesota
    Posts
    9,500
    Thanks
    8
    Thanked 1,089 Times in 1,080 Posts
    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 Code:
    <?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).



    .
    Last edited by mlseim; 11-25-2010 at 08:43 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •