StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I found some small problems in your code. I am not sure that my suggestions will solve all the problems, but I decide to describe my first results here.</p> <p>1) You should remove comma before the '}'. Currently the call look like <code>$("#column").sortable({/**/,});</code></p> <p>2) The function <code>equalHeight</code> is not jQuery plugin. It is the reason why the call <code>$(".block").equalHeights();</code> inside your 'click' event handler follows to the error "$(".block").equalHeights is not a function" which you described. You should change the place of the code to <code>equalHeight($(".block"));</code> like you use it on other places.</p> <p>3) The script <a href="http://vitaminjdesign.com/adrian/js/equalHeight.js" rel="nofollow">http://vitaminjdesign.com/adrian/js/equalHeight.js</a> defines the function <code>equalHeight</code> only and not start any actions. Once be loaded it stay on the page. So you <strong>should not load</strong> it at the end of every ajax request. So I suggest to reduce the script</p> <pre><code>$(document).ajaxSuccess(function(){ var script = document.createElement('script'); script.src = 'http://vitaminjdesign.com/adrian/js/equalHeight.js'; document.body.appendChild(script); equalHeight($(".block")); $("a[href^='http:']:not([href*='" + window.location.host + "'])").each(function() { $(this).attr("target", "_blank"); }); }); </code></pre> <p>to</p> <pre><code>$(document).ajaxSuccess(function(){ equalHeight($(".block")); $("a[href^='http:']:not([href*='" + window.location.host + "'])").each(function() { $(this).attr("target", "_blank"); }); }); </code></pre> <p>4) I suggest to change the code of <a href="http://vitaminjdesign.com/adrian/js/equalHeight.js" rel="nofollow">http://vitaminjdesign.com/adrian/js/equalHeight.js</a> from</p> <pre><code>function equalHeight(group) { tallest = 0; group.each(function() { thisHeight = $(this).height(); if(thisHeight > tallest) { tallest = thisHeight; } }); group.height(tallest); } </code></pre> <p>to</p> <pre><code>function equalHeight(group) { var tallest = 0; group.each(function() { var thisHeight = $(this).height(); if(thisHeight > tallest) { tallest = thisHeight; } }); group.height(tallest); } </code></pre> <p>to eliminate the usage of global variables <code>tallest</code> and <code>thisHeight</code>. I recommend you to use <a href="http://www.jslint.com/" rel="nofollow">JSLint</a> to verify all your JavaScript codes. I find it very helpful.</p> <p>5) I recommend you to use any XHTML validator to find some small but sometime very important errors in the markup. Try <a href="http://validator.w3.org/check?uri=http://vitaminjdesign.com/adrian" rel="nofollow">this</a> for example to see some errors. The more you follow the XHTML standards the more is the probability to have the same results of the page in different web browsers. By the way, you can dramatically reduce the number of the errors in your current code if the scripts included in the page will be in the following form</p> <pre><code><script type="text/javascript"> //<![CDATA[ /* here is the JavaScript code */ //]]> </script> </code></pre> <p>I didn't analysed the full code but I hope that my suggestions will solve at least some of problems which you described in your question.</p>

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