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 5 of 5
  1. #1
    Senior Member bamme's Avatar
    Join Date
    Aug 2009
    Posts
    319
    Member #
    19662
    Liked
    1 times
    jquery question

    i am a beginner with jquery and wondered if anyone could possibly give me a hand with trying to write something for this page; it's a quick little css addition using jquery that i need.

    Basically i want to set a div's height using inline styles, based on whether an image is landscape/portrait.

    if you see this page: StephenBailey.co.uk | Designer and Maker of Bespoke Wooden Furniture in Alton

    Yuo'll see that vertical image in the middle of the 3 is overlapped by the image below it - because the containing divs holding these images are all the same height, and too short for the one vertical image. These images are added thru a CMS so there's no way of setting specific sizes for their individual containing divs. You can view source for an idea of what goes where.

    What I want to do with jquery is:

    1) loop thru the elements
    2) get the height/width of each image
    3) if the height is greater than the width, set that image's containing div (class "slideshow-container") to have an inline style of "height:460px"

    Some points are that there are numerous instances of "slideshow-container" so each one might have to be given an id or something - as it is only the container holding the vertical image(s) that need to have the height style rule added, to avoid this overlapping.

    Can anyone help me??

  2.  

  3. #2
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    wow. that is so overkill dude. you suffer from bad CSS. you don't need to set the height at all if it is built right. you have to many predefined dimensions. a good layout would be fluid and adapt to the content size.

    while($get_it !== true){ continue; }

  4. #3
    Senior Member bamme's Avatar
    Join Date
    Aug 2009
    Posts
    319
    Member #
    19662
    Liked
    1 times
    Thanks I appreciate that Dorky, however my job is to just make tweaks to this. so can anyone please help me with the jquery part?

  5. #4
    Senior Member Dorky's Avatar
    Join Date
    Jun 2009
    Location
    Destin Florida
    Posts
    1,430
    Member #
    19103
    Liked
    4 times
    idk about jquery but PHP: getimagesize - Manual is all you need.

    <?php $file = "path/to/image.jpg"; list($width, $height) = getimagesize($file) ; ?>

    <style>
    img.class {
    width: <?php $width ?> ;
    height: <?php $height ?> ;
    }

    </style>

    just change $file = to the actual image path, css .class to your actual class, and index.html to index.php

    even if you can't touch the css, it's still overkill to use jquery for this.

    while($get_it !== true){ continue; }

  6. #5
    Senior Member paintingtheweb's Avatar
    Join Date
    Jul 2007
    Location
    Las Vegas
    Posts
    128
    Member #
    15503
    Did you figure this out already? I went to the site and didn't notice any overlapping. If you still need help on this, let me know and I'll take a look.


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
  •  
All times are GMT -6. The time now is 10:37 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com