jQuery - Find distance between two DIVs
Topics related to client-side programming language.
Post questions and answers about JavaScript, Ajax, or jQuery codes and scripts.
-
MarPlo
- Posts: 142
jQuery - Find distance between two DIVs
I have two DIVs that I need to know the calculated browser distance (in width and height) of them.
Example html:
Code: Select all
<div id="dv1">div 1</div>
<div id="dv2">div 2</div>
I want to know the horizontal and vertical distances between these two (in pixels), using jQuery.
Admin
Use the offset() function.
Something like this should work:
Code: Select all
<div id="dv1">div 1</div>
Some text ...<br>
https://coursesweb.net/
<div id="dv2">div 2</div>
<script>
var dist_ho = Math.abs($('#dv1').offset().left - $('#dv2').offset().left); // horizontal distance
var dist_ve = Math.abs($('#dv1').offset().top - $('#dv2').offset().top); // vertical distance
// test
alert('dist_ho: '+ dist_ho + ' - dist_ve: '+ dist_ve);
</script>
-The Math.abs() methods is used to have positive values.
Similar Topics
-
Find item in array and set as first index
JavaScript - jQuery - Ajax
First post
Say I have the following array of persons:
const arr =
And I want to find a certain person (name) in this array, and put it as the first...
Last post
You could sort the array with the sort() method.
This approach moves all objects with the wanted 'name' to top.
const arr = ;
let first =...
-
Find multiple matches with regex in php string
PHP - MySQL
First post
I have this string: 'mr (3_22) mrs (1_12) miss (2_4)'
I want php to output that string to: (3_22)(1_12)(2_4)
How can i do that with php?
Last post
You can use preg_match_all() . Try the following code:
$str ='mr (3_22) mrs (1_12) miss (2_4)';
$re ='';
if(preg_match_all('/(\( +\))/i', $str,...
-
Get name in fbautocomplete jquery plugin
JavaScript - jQuery - Ajax
First post
I`m almost their with my tag-system
But my second question for today: I can`t find-out how to detect the names from this javascript.
I can detect...
Last post
Yes, in that function.
Then, see in browser console (F12) what data is displayed.
-
Execution order with jQuery-AJAX
JavaScript - jQuery - Ajax
First post
I have this code (ajax is async):
function echoHello(){
return $.ajax({
//this will return hello ;
});
}
function echoWorld(){
return world...
Last post
Ajax makes a call to the web server and is asynchronous. You don't know how long it will take. It is the same as:
setTimeout(_ => {...