SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Zealot gidday's Avatar
    Join Date
    Jan 2007
    0 Post(s)
    0 Thread(s)

    Grid 960 and jQuery

    Hiya Folks

    I am using Grid 960 for page layout. I am using JQuery to supply a bit of animation. Code is below.
    The problem is that when I click on my button to expand the view the border of my containing div does not expand with it and I'd like it to. I suspect that this is something to do with the Grid float of all divs.

    This is the JQuery script I use to expand and contract the div.
    <script type="text/javascript">
    	// Andy Langton's show/hide/mini-accordion - updated 23/11/2009
    	// Latest version @
    	// this tells jquery to run the function below once the DOM is ready
    	$(document).ready(function() {
    		// choose text for the show/hide link - can contain HTML (e.g. an image)
    		var showText='[+]';
    		var hideText='[-]';
    		// initialise the visibility check
    		var is_visible = false;
    		// append show/hide links to the element directly preceding the element with a class of "toggle"
    		$('.toggle').prev().append(' <a href="#" class="toggleLink">'+showText+'</a>');
    		// hide all of the elements with a class of 'toggle'
    			// capture clicks on the toggle links
    			$('a.toggleLink').click(function() {
    				// switch visibility
    				is_visible = !is_visible;
    				// change the link depending on whether the element is shown or hidden
    				$(this).html( (!is_visible) ? showText : hideText);
    				// toggle the display - uncomment the next line for a basic "accordion" style
    				// return false so any link destination is not followed
    				return false;
    All help appreciated.

    "All that is necessary for the triumph of evil
    is that good men do nothing."

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Melbourne, AU
    462 Post(s)
    8 Thread(s)
    Hi Joe. We really need to see a live link to understand what's happening, or at least a full, working example that includes the HTML and CSS.


Posting Permissions

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