SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    970
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    using a variable for .css position 'type'

    Using Jquery, and I'm trying to make a element positioned either from the top or bottom based on where it is in a grid.
    Code JavaScript:
    if (position.top+width > container_height) {
         var position_type = "bottom";
    } else {
         var position_type = "top";
    }

    and then apply it like so
    Code Javascript:
    .css({position_type:position.top+padding,"left":position.left+7,"width":width,"height":width})

    This isn't working. Anyone know a reason why? Can't seem to find anything on google, but maybe I'm not using the correct term.

    Thanks for any kind of help/insight.
    your brain reacts in the same way whether you are
    looking at something or thinking about it...

  2. #2
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    970
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okay, came up with a solution, but it's pretty 'clunky'.
    Code JavaScript:
    		$('<div class="term_definition"><p><b>' + title + '</b>' + term + '</p><img src="/images/close_button.png" class="definition_close" /></div>').hide().css({"width":width,"height":width}).appendTo($(benefit_grid_term).parent('dl'));
     
    		var target_div = $('.term_definition');
    		if (position.top+width > container_height) {
    			$(target_div).css({'bottom':padding+4});
    		} else {
    			$(target_div).css({'top':position.top+padding});
    		}
     
    		if (position.left+width > container_width) {
    			$(target_div).css({'right':padding+4});
    			var right = position.left+width;
    		} else {
    			$(target_div).css({'left':position.left+padding});
    		}
     
    		$(target_div).slideToggle('fast');

    Seems like I should be able to place a variable in the css block for the name of the style i'm messing with instead of having to do new css methods for each one.
    your brain reacts in the same way whether you are
    looking at something or thinking about it...


Bookmarks

Posting Permissions

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