Categories
CSS Web Development

Avoid 'page jump' by forcing a scroll bar

Occasionally a web page jumps horizontally because a switch of page or change of content causes a vertical scroll bar to appear.

This can be avoided with a little CSS trick;

1
2
3
  html {
    overflow-y: scroll;
  }

This can be placed in the <head> element of a page that is prone to the problem, or in the header include file for a site.

The result of this is that when a vertical scroll bar is not needed on a site, its place is taken by an unobtrusive pseudo-scroll bar, greyed out like other inactive controls.

Categories
Web Development

Web Development Links

This is a collection of useful links for web development.  Not my content, but useful nonetheless!

Categories
PHP

Strip the extension off of a filename in PHP

Here's a useful function to strip the extension off of a filename.

if($ext !== false) {
$name = substr($name, 0, -strlen($ext));
}
return $name;
Categories
Networking Operating Systems

Setting up a DNS Round Robin in Windows

A round robin lets you load balance by pointing the same host name to multiple servers in DNS.  As long as round robin service is enabled in the DNS server, incoming requests will be spread among the servers.

Following is the short version of how to do this.  For a more comprehensive look at this, see Rodney Buikes excellent article on the subject.

  • In the DNS Mgmt application on your DNS server, right click the server name in the tree in the left pane, select Properties, select the Advanced tab, ensure that ‘Enable round robin’ is selected.
  • Add HOST(A) records in the appropriate forward lookup zone, pointing to the servers to be covered.
  • If you want a little poor-man's fault tolerance, ensure that the TTL of each record is set to a short period of time, i.e. 15 seconds.  This ensures that if one of the servers fails, repeated attempts to connect will soon hit another server.
Categories
DHTML JavaScript

Sortable Tables with JavaScript

For years I've fiddled with trying to make my tables sort in JavaScript.  The user can simply click on the column header to make the table sort on that column.  Click again and it sorts the other way.

There were various scripts out there to do it, but I never had the time and need all at once to get one to work.  None seemed to really work well, or they weren't documented well.

Now I've found it. This one works right out of the box. It's well documented on the page, but here's the gist of it;

To make the Javascript available to your pages:

  • Load the sortabletable.js file into your site.
  • Reference the script in the <head> section of your pages.

Now make the following modifications to the pages with tables;

  • Wrap the row that contains your column headers with <thead></thead> tags.
  • Make sure the row with the colum headers used <th></th> tags instead of <td></td>.
  • Wrap the rows that contain your table data with <tbody></tbody> tags.
  • Add an id="MyTable" attribute to the <table> tag for each table you want sorted.  Of course, the id must be unique on the page.
  • Place the sortable table object immediately after each sortable table.  It's shown in the sample code on the site, easy to place with a simple cut and paste, but remember to replace the 'MyTable' string with the id you used in that table's <table> tag.

That's it!  The table now sorts.  Sweet.

Here's where to find it:

While you're there, remember how whoever runs that site pays his or her bills.

If you're not familiar with the very helpful but little used <th><thead><tbody> and <tfoot> tags, Google them.

2009-04-04: Late News: There's a more advanced table sorting method in this frequency-decoder.com article.

2009-08-10: Late News: And now this great script at yoast.com that has alternate row colouring in the javascript, so that it sorts properly.