Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery onclick float left and return back
    primarykey
    data
    text
    <p>I have this javascript code written and the when you click on the info panel... It should float the <code>address</code> div to the center using the addressmoved.</p> <p><strong>Issues</strong></p> <p>When I click on the trigger button, instead of the <code>address</code> div floating to the center, it goes to the button of the next contents, which shouldn't happen. Also, when you click on the trigger button to close the info panel, the address div should go back to normal. </p> <p><strong>Question</strong></p> <p>How can i get the address to go to the center when you click on the trigger button and also how can I get it to go back to the right position when when you click on the trigger button. <strong>jquery</strong></p> <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function(){ $(".trigger").click(function(){ $('.address').removeClass('address').addClass('addressmoved'); $(".panel").toggle("fast"); $(this).toggleClass("active"); return false; }); }); &lt;/script&gt; </code></pre> <p><strong>CSS</strong></p> <pre><code>.addressmoved{ float:left; right:0; } .address{ font-size: 18px; height: 120px; position: absolute; right: 100px; top: 50px; width: 200px; } </code></pre> <p><strong>HTML</strong></p> <pre><code>&lt;div class="address"&gt; &lt;img src="image.png" alt="mainicon" /&gt; &lt;span&gt;hellow&lt;/br&gt; &lt;em&gt;world&lt;/em&gt; &lt;/span&gt; &lt;ul&gt; &lt;li class="icon"&gt; &lt;img class="social" src="icon1.png " alt="icon1"/&gt; &lt;/a&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre>
    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.
 

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