Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 10 of 10
  1. #1
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    Hi
    http://www.alldeathnote.com/deathnotewallpaperslb.php

    This is my wallpaper gallery and im using slimbox, now some of the wallpapers are 1600x1200 and when clicked, they explode onto the screen.
    I want to scale down the image, but cant find the correct css or javascript to do so

    #lbImage {
    position: absolute;
    left: 0;
    top: 0;
    border: 10px solid #fff;
    background-repeat: no-repeat;
    }

    This is the css property pertaining to the image container, it looks like theyre setting the image up as a background, and therefore i cant modify its height n width

    http://www.digitalia.be/software/slimbox2

    This is the link to slimbox where the javascript source can be gotten from.

    If you guys could help id greatly appreciate it, this codes just a lil to complex for me.
    If i could just find the correct place in the javascript to possibly add like

    /2 to image height and width, i think itd be fine

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,715
    Member #
    5580
    Liked
    717 times
    How about using PHP GD to resize it?

    Your link goes to another PHP script that displays the single
    wallpaper any size you want. It could also display it in a pop-up
    if you like those.

    Your link would look like this:

    <a href="display.php?pic=dragons.jpg">Dragons Wallpaper</a>

    Since you're currently not linking to another PHP script or webpage, you will somehow
    need to have a place to display the half-size photo. I recommend you create a page
    called "display.php" where you display the reduced wallpaper photo along with other
    stuff.

    You can also display any JPG image half size by using the <img src> tag like this:
    <img src="show.php?pic=myfavoritewallpaper.jpg" alt="" />

    The PHP script called "display.php" would look like this:
    PHP Code:
    <?
    $pic
    =$_GET['pic'];

    // Following is the actual HTML for the page that shows your reduced image.
    // Use CSS or whatever you want for the page.
    ?>

    <html>
    <body>
    <img src="show.php?pic=<?=$pic?>" />
    </body>
    </html>

    The PHP GD script to render the image, called "show.php" looks like this:
    PHP Code:
    <?php

    // path (directory) to your images, include trailing slash /
    $path="/images/";

    if(
    $_GET['pic']){

    $filename=$path.$_GET['pic'];

    // Get the dimensions
    list($width_orig$height_orig) = getimagesize($filename);

    // Resize if desired ... this example is half-size
    $width=$width_orig/2;
    $height=$height_orig/2;

    // Resample
    $image_p imagecreatetruecolor($width$height);
    $image imagecreatefromjpeg($filename);
    imagecopyresampled($image_p$image0000$width$height$width_orig$height_orig);

    // Output
    header('Content-type: image/jpeg');
    imagejpeg($image_pnull100);

    // Clean-up Memory
    imagedestroy($image_p);

    }
    ?>


  4. #3
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    hey msleim, thanks for the suggestion.
    unfortunately this is not what i want.

    tkae a look at
    http://www.alldeathnote.com/deathnotewallpapers.php

    This is the way im currently doing it, but using CSS to style the image on the new page and drop its width and height in the same %.

    the deathnotewallpaperLB (lb standing for lightbox) is the new effect i want to achieve.
    I really like the look, feel, and elegancy but simpleness of lightbox and would like to use it as i think it gives my site some needed flare.

    thanks for your suggestion

    Could you possibly take a look at the slimbox javascript n see if you can figure out where it dumps the image...i could possibly change this to an image tag and then
    style the image like so

    #lbOverlay img{height:80%; width: 80%;}

    Your help is muchly appreciated

  5. #4
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    really? nothing?
    I mean lightbox is extremely popular, has no1 run into this problem yet?

  6. #5
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,715
    Member #
    5580
    Liked
    717 times
    Because resizing on the fly takes so much processing time, I usually
    do the resizing when the image is uploaded ... making a couple copies
    of the same image in different sizes (like a full and a thumb) ... in your case,
    you would have 3 sizes (thumb, lightbox size, full size).

    So for me, it has not been a problem.


  7. #6
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    hmmm, 3 sizes cry.
    that seems like the best option at this point

    thanks

  8. #7
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,715
    Member #
    5580
    Liked
    717 times
    If you upload an image using PHP, you can use GD to resize automatically
    and then save it ... or all three sizes in your case. Just add a suffix within
    the filename and reference it that way later on, example:

    mywallpaper123_l.jpg (large)
    mywallpaper123_m.jpg (medium)
    mywallpaper123_s.jpg (small)


  9. #8
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    my sites are built from scratch with no CMS. i update content myself.
    so i dont wanna build the upload form. I will just use photoshop macros to go through the wallpapers list and resize (my thumbnails are all made from a photoshop macro) i can append the suffix there i suppose. thanks for all your help

  10. #9
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,715
    Member #
    5580
    Liked
    717 times
    Scott,

    You can make things sort of easier if you use a simple text flat-file database
    to handle your images. Use your photo editor to resize them, and then upload
    them all to an image directory.

    Make a plain text file with a list of images, each one has an ID, filename, and caption.
    For the filename, leave off the extension when you enter them on your list.
    Like this ...

    123|wallpaper221|This is a wallpaper for gaming fans
    124|sportswallpaper6|Sports fans can use this wallpaper

    Then, a PHP script can open that file and read each line, creating the HTML
    for your gallery page. It will look at each field (between pipes | ) and automatically
    generate the images needed by appending _s.jpg _m.jpg _l.jpg to the end of
    the filenames.

    You can still use LightBox, but you won't have to edit your HTML any more.
    The PHP script will make the gallery page for you using the information it finds
    on each line in your text file database.

    You upload the images and edit the database ... no more editing your HTML
    every time you upload a new wallpaper.


  11. #10
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    I dont edit my html much at all.
    im using a MySql backend that has the image name

    image
    ------------
    wallpaper1.jpg

    path for wallpapers: images/wallpapers/wallpaper.jpg
    path for thumbnail: images/thumbnails/wallpaper_tn.jpg

    All wallpapers are generated with 1 loop.

    its pretty much what your talking about, but thanks for the advice


Remove Ads

Posting Permissions

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

Search tags for this page

slimbox width height

Click on a term to search for related topics.
All times are GMT -6. The time now is 12:03 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com