StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Use a specific class name for all of the target DIVs. Even though they will have a dynamic ID if you use a pre-defined class name you will be able to locate them using a simple jQuery. You can then write code in your application JS files and target only those specific class names.</p> <p>Update: Here is an example that gives you what you want. This is straight HTML/Javascript but the container DIVs use a unique ID but common class name. You can easily move this into your Rails app:</p> <pre><code><html> <head> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <style> .hidden-div { border: 1px solid silver; margin-bottom: 10px; } .hidden-div DIV { display: none; } </style> <script> $(function() { $(".hidden-div").hover(function() { // we are hovering over a hidden-div class $(this).children("div").show(); }, function() { // we are moving out of a hidden-div class $(this).children("div").hide(); }); }); </script> </head> <body> <div id="random-id-1434" class="hidden-div"> Hover over me to reveal my hidden fields <div>A hidden field</div> <div>A hidden field</div> <div>A hidden field</div> <div>A hidden field</div> </div> <div id="random-id-342" class="hidden-div"> Hover over me to reveal my hidden fields <div>A hidden field</div> <div>A hidden field</div> <div>A hidden field</div> <div>A hidden field</div> </div> <div id="random-id-887" class="hidden-div"> Hover over me to reveal my hidden fields <div>A hidden field</div> <div>A hidden field</div> <div>A hidden field</div> <div>A hidden field</div> </div> </body> </html> </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

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