Page 1 of 1

[jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 9:45 am
by Wolfie
pickle | Please use [ code=php ], [ code=text ], etc tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: :arrow: Posting Code in the Forums to learn how to do it too.


Hi all,


I have a menu which dynamicaly load anchors on page depending of the database records, so when I click on one menu button I have for example 5 anchors on page, and when I click on second menu button I have 12 anchors.

The anchors have diferent height depending on how many lines of text they have, and I need to calculate the sum of the all anchors loaded on page, to make the scrolling page, cause some of theme will be hidding behind some div.

I did something like this :

Code: Select all

 
$steps = $(".data a").length;
            $h = $(".div a").height;
            $obj = $(".data a");
            $(".data a").each(function() {
                $height = $(".data a").height();
            });
            return $height;
 
Where $steps is the number of all anchors on the loaded page, $h should be the height of an anchor , but it doesn't work, also each() doesn't work, please help.....
I need to calculate the sum of the haight of all anchors on page.....


pickle | Please use [ code=php ], [ code=text ], etc tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: :arrow: Posting Code in the Forums to learn how to do it too.

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 10:14 am
by pickle
- You're using .height in one place, and .height() in another - which is the correct one?
- You never use $obj after creating it.
- The each() construct loops through all the results of the associated selector. Inside each(), "this" refers to the current element - which is what you want to check the height of.

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 10:22 am
by Wolfie
Ok, I have changed the way to move my div, but now I need only to get the height of the dynamicaly loaded div

I am doing this :

Code: Select all

 
$h = $("#content_bottom").height();
 
For static div it works fine but not for dynamic.....
Enabody now how to handle this issue ?

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 10:30 am
by John Cartwright
You should be able to access elements dynamically loaded into the DOM. Can you post your updated source? (what you have posted so far is unclear).

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 10:50 am
by Wolfie
Just forget about each loop, now I only have to get the height of the dynamically loaded div and here is the code :

Code: Select all

 
$('a[href="aktualnosci.php"]').click(function(){
      $('#content_bottom').load('dataprocess.php', {'kategory':$('a[href="aktualnosci.php"]').attr('title')}, function() {
            $(this).hide().animate({"height": "toggle", "opacity": "toggle"}, { duration: "slow" });//.fadeIn('slow');
            $steps = $(".data a").length;
            $h = $("#content_bottom").height();
        });
      return false;
   });
 
But the thing is that firebug shows that $h wariable is 1....so it is some error....

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 10:58 am
by John Cartwright
I've never actually seen anyone prepend their variables in javascript with $, like in PHP. Are you sure thats what was desired? What happens when the run the following?

Code: Select all

 
$('a[href="aktualnosci.php"]').click(function(){
      $('#content_bottom').load('dataprocess.php', {'kategory':$('a[href="aktualnosci.php"]').attr('title')}, function() {
            $(this).hide().animate({"height": "toggle", "opacity": "toggle"}, { duration: "slow" });//.fadeIn('slow');
 
            var test = $("#content_bottom").height();
            alert(test);
        });
      return false;
   });
 
Secondly, why exactly do you need to know the height of this element? You can probably design the CSS to incorporate your style requirements.

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 11:01 am
by jayshields
I don't think you can prefix variables with $ in JavaScript. He's probably confused it with the jQuery syntax ($ function call).

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 11:09 am
by Wolfie
Well, I can prefix it with $

for example this :

Code: Select all

 
$h = $("#frame").height();
 
Works just fine, but the div #frame is the static div, and #content_bottom is dynamic div and I think this is the problem

When I am using this :

Code: Select all

 
var test = $("#content_bottom").height();
alert(test);
 
I get the alert with '1' text, the same value as when using this :

Code: Select all

 
$h = $("#content_bottom").height();
 
Checked in firebug......

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 11:18 am
by kaszu
.height() will return current height which is set by animation

Code: Select all

$(this).hide().animate(...);  //Here you hide the element and then start animation from height 0 to X, so it's impossible to determine inner/actual height.
...
$h = $("#content_bottom").height(); //which you are trying to get here
you need to get height before animating that element

Code: Select all

$h = $("#content_bottom").height();
$(this).hide().animate(...);

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 11:23 am
by Wolfie
Oh man ! You are awesone 8)


Thank u very much !

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Mon Sep 21, 2009 2:16 pm
by pickle
<offtopic a bit>
You are allowed to use "$" in javascript variables. That's why the shortcut for the jQuery (and possibly other libraries)object is just "$" - that's a variable. Prepending "$" is sometimes done in jQuery plugins to indicate that the variable represents a jQuery object.

For example, if I'm doing a bunch of different work on a single selector (and for some reason I can't chain), you would do this:

Code: Select all

$anchors = $("a");
$anchors.show();
$anchors.hide();
$anchors.load('http://www.mysite.com/ajaxlinktextloader.php');
The "$" lets someone know who's quickly looking at code realize that "$a" is a jQuery object.
</offtopic>

Re: [jQuery] Sum of the height of all dynamically loaded anchors

Posted: Fri Sep 25, 2009 5:35 pm
by pankajnagarkoti70
The anchors have diferent height depending on how many lines of text they have, and I need to calculate the sum of the all anchors loaded on page, to make the scrolling page, cause some of theme will be hidding behind some div.