Note that there are some explanatory texts on larger screens.

plurals
  1. PODisplay the 'right' style of a div with JQuery
    primarykey
    data
    text
    <p>I'm trying to display the "right" value of a div named "slider", displaying it inside of "span.display_value" </p> <pre><code> var rightStyleValue = $('div.slider').css('right'); alert(rightStyleValue); $('.display_value').html(rightStyleValue); </code></pre> <hr> <p>UPDATE: Html is posted below. I'm using a drag and drop script to drag a div called "slider" that is inside of a div named "container". I want to have it "do something" when the "right" property of the div "slider" reaches 45px(ideally, when the user drags "slider" all the way to the right side of it's parent "container")</p> <p>Right now, when the page loads it will display the value that i specifically set in the css: "Right:-10". so it will display it once, but i'm not sure how to keep updating the displayed value for the "slider" div.</p> <p>i don't know where to put: $('.display_value').html(rightStyleValue); to have it continually updated.</p> <hr> <pre><code>&lt;head&gt; &lt;style&gt; div.container { height:15px; width:200px; overflow:hidden; background-color:#858585; } div.slider { height:15px; width:20px; background-color:#000; position:relative; right:-10px; } &lt;/style&gt; &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="js/easing.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="js/dragcopy.js"&gt;&lt;/script&gt; &lt;script&gt; $().ready(function() { $('.slider').jqDrag(); $('.slider') .jqDrag(); }); $(document).ready(function() { var rightStyleValue = $('div.slider').css('right'); alert(rightStyleValue); $('.display_value').html(rightStyleValue); $(".slider").mousedown(function() { if ($('.slider').css('right') == -8 + "px") { $('.container').fadeOut('slow'); } }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="container"&gt; &lt;div class="slider"&gt; &lt;/div&gt; &lt;/div&gt; &lt;p&gt;slider right:&lt;span class="display_value"&gt; &lt;/span&gt;&lt;/p&gt; &lt;/body&gt; </code></pre> <p></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload