Register FAQ / Rules Forum Spy Search Today's Posts Mark Forums Read
Go Back   MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Reply
 
Thread Tools Search this Thread Display Modes
Old Oct 31, 2012, 02:17 PM   #1
Teleportable
macrumors newbie
 
Join Date: Oct 2012
Spry Accordion - Thumbnail Portfolio ContentPanel Height

Hi there!

This is my very first website and I'm afraid I might be making newbie mistakes. I'm working on my own photography portfolio and I decided to use Spry Accordion to hold the thumbnails for my galleries. Currently, when I expand a tab, the content panel extends the entire height of all of the thumbnails. Is there a way to have the panel open to a fixed height so that only two rows of thumbnails are visible and have the rest of the thumbnails visible either when you scroll on the y-axis or possibly by pressing a "next" button?

Also, I might need to start a new topic for this question, but is there a way to have the larger images which are displayed in the div to the farthest right centered vertically and automatically resize to a smaller browser size?

Here's a URL to the site:

http://solaimanfazel.com/test.html

Thanks so much in advance!!!!!
Teleportable is offline   0 Reply With Quote
Old Oct 31, 2012, 06:31 PM   #2
Teleportable
Thread Starter
macrumors newbie
 
Join Date: Oct 2012
After hours of research, i realized I had written the following script:

<script type="text/javascript">
var Accordion1 = new Spry.Widget.Accordion("Accordion1", { useFixedPanelHeights: false, defaultPanel: -1});

I changed the "false" value to "true" and it worked!

Now I just need to learn how to auto fit the full sized images to the browser window.

Any leads?
Teleportable is offline   0 Reply With Quote
Old Nov 1, 2012, 05:33 AM   #3
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Quote:
Originally Posted by Teleportable View Post
Now I just need to learn how to auto fit the full sized images to the browser window.

Any leads?

Might want to check our these convenient jQuery solutions:

http://buildinternet.com/2009/07/qui...r-window-size/

http://code.google.com/p/jquery-imagefit-plugin/

jQuery is a Javascript framework that makes client side scripting much easier. The first link is more of a DIY which seems to do what you want, the second link is a plugin that will resize images to a container, i.e. a div holding a picture from your folio.

Also note two very handy jQuery functions:

$(window).height(); // returns height of browser viewport
$(document).height(); // returns height of HTML document

Change height to width for determining width of course.
__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com
SrWebDeveloper is offline   1 Reply With Quote
Old Nov 1, 2012, 06:25 PM   #4
Teleportable
Thread Starter
macrumors newbie
 
Join Date: Oct 2012
Quote:
Originally Posted by SrWebDeveloper View Post
Might want to check our these convenient jQuery solutions:

http://buildinternet.com/2009/07/qui...r-window-size/

http://code.google.com/p/jquery-imagefit-plugin/

jQuery is a Javascript framework that makes client side scripting much easier. The first link is more of a DIY which seems to do what you want, the second link is a plugin that will resize images to a container, i.e. a div holding a picture from your folio.

Also note two very handy jQuery functions:

$(window).height(); // returns height of browser viewport
$(document).height(); // returns height of HTML document

Change height to width for determining width of course.
Wow Jim! Thank you sooo much for taking the time to post those links!! I'm reading through them now and they sound exactly like what I'm looking for!

I was doing some research myself yesterday and I came across the idea of "media queries" & responsive webdesign....The concept sounds similar to these jQuery links...do you agree? Is one better than the other?

REALLY appreciate your guidance!!!!

Last edited by Teleportable; Nov 1, 2012 at 06:33 PM. Reason: forgot to quote the awesome Jim Goldbloom
Teleportable is offline   0 Reply With Quote

Reply
MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
thread Thread Starter Forum Replies Last Post
Thumbnail problem dazzw Mac Basics and Help 0 May 24, 2013 06:13 AM
Get thumbnail of page? ArtOfWarfare iPhone/iPad Programming 3 Apr 13, 2013 09:47 AM
Screenshot Thumbnail Zakko1999 Mac Applications and Mac App Store 2 Nov 6, 2012 10:12 AM
picture thumbnail N-Y iPhone 1 Sep 29, 2012 09:02 AM

Forum Jump

All times are GMT -5. The time now is 02:33 AM.

Mac Rumors | Mac | iPhone | iPhone Game Reviews | iPhone Apps

Mobile Version | Fixed | Fluid | Fluid HD
Copyright 2002-2013, MacRumors.com, LLC