Standardista Table Sorting Posted by Neil Crosby on February 26, 2006 03:15 PM Standardista Table Sorting is a JavaScript module that lets you sort an HTML data table by any column. The module has the following advantages: It works. Download Standardista Table Sorting now. How to use Standardista Table Sorting First, download the Standardista Table Sorting module.Include the .js files in the HEAD of your webpage: <script type='text/javascript' src='common.js'></script><script type='text/javascript' src='css.js'></script><script type='text/javascript' src='standardista-table-sorting.js'></script> Make sure that the table you want to be sortable has a THEAD and a TBODY.Give the table that wants to be able to be sorted the class “sortable”.Load the page, and you’ll be able to sort the table by clicking on its headers! Extended Pointers for using Standardista Table Sorting Every table that you want users to be able to sort must contain a THEAD and a TBODY section. An Example Table to Sort Goals for my Table Sorting script
Rendre transparents tous les PNG sous Internet Explorer - Babylon-Design - Tutoriaux WebDesign : Adobe Photoshop, XHTML/CSS, Accessibilité Rubrique Développement Web J’ai testé plusieurs solutions alternatives pour simuler la transparence des PNG sous Internet Explorer. Chacune possède ses avantages mais aucune ne propose un solution complète notamment par rapport aux images de fond en CSS. Après un petit mix de toutes ces astuces, voici un petit script simple, et j’espère complet. Publié il y a déjà trop longtemps… Un des gros problèmes d’Internet Explorer est qu’il ne gère pas les degrés d’alpha des images PNG. Pour comprendre ce qu’est une image PNG et sa non prise en compte par Internet Explorer, voici une petite illustration d’une image PNG affichée dans Firefox et Internet Explorer sur un fond rouge (#F00). Remplacer le gris immonde d’Internet Explorer Pour eviter d’avoir le gris par défaut qu’affiche Internet Explorer, il est possible de modifier les en-têtes de l’image PNG. Pour ce faire il faut utiliser un petit logiciel tel que TweakPNG qui va permettre au navigateur de Microsoft d’afficher la couleur de votre choix.
Usability for Rich Internet Applications The web professional's online magazine of choice. In: Articles By Donna Maurer Published on February 20, 2006 After struggling for years to design Internet applications around the limitations of HTML, I have been very excited by the recent release of a range of Internet applications with increased richness and interactivity. The key challenge in designing part-page updates is making sure people see them. Rich Internet applications (RIAs) can provide opportunities to design much better user experiences. In this article, I provide some practical tips for designing usable RIAs, based on fundamental principles of HCI. What’s an RIA? According to the Wikipedia, RIAs are “a cross between Web applications and traditional desktop applications, transferring some of the processing to the client end.” The key difference between RIAs and other Internet applications is the amount of interaction in the interface. Some of my favorite sites with RIA-style interfaces include: In contrast, Yahoo! Want More?
A Complete Guide To Web Analytics Solutions » Conversion Rater The web analytics space is not an easy one to navigate as there are numerous companies and product types which will fit your needs differently. In order to help find the way through it all, I’ll map out the options as they currently stand. Please let me know if I’m missing an application you think should be listed. I’ll check it out and add it. The Freebies There are numerous free solutions out there, and they range from very useful to “you paid for what you got”. Analog – One of the oldest web analytic packages available. AWStats – An improvement on Analog, but still a logfile-based solution. Google Analytics – The new kid on the block that made the biggest splash in 2005. SiteMeter – A previously popular solution for bloggers and small websites, Sitemeter has a free version that just requires you put their colorful logo at the bottom of your site. Webalizer – Similar to AWStats and Analog, Webalizer is a logfile analysis solution that is free.
ECMAScript Menu System Summary It is far easier to maintain content that is free from presentation and behaviour elements and attributes. Separating content, presentation, and behaviour is not only easier to maintain, it's also more accessible and search engine friendly, as the content is more likely to be machine readable. This article walks through the steps required to build an accessible, dynamic menu, with separate content, presentation, and behavioural layers. Author: Gez Lemon Contents The Behavioural Layer There has been lots written about separating content from presentation, and most developers see the benefit of this approach (cleaner, leaner markup; faster download speeds; easier maintainability, etc). [Back to the contents] ECMAScript All the time JavaScript was a Netscape proprietary technology, its use could not be endorsed by the W3C. Collapsible Menu System To illustrate using a completely separate behavioural layer, I'll demonstrate a collapsible menu system. Hiding Nested Lists window.onload=rollup;
stu nicholls | CSS PLaY | image map for detailed information Information A further stage in the use of a css image map. Just hover your mouse over the painting to reveal three areas of interest. This method could be used on an educational site to give information and enhanced details of images in general. The idea is based on my previous image maps but takes it a step further in functionality. Works in IE5.5 and almost works in IE5.01 Copyright You may use this method on your personal 'non-profit' web site without seeking my permission. Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay. If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced.
CSS Layout Starting Points I build a lot of CSS layouts, some incredibly simple, others that cause sleepless nights and remind me of the torturous puzzle books that were given to me at Christmas by aunties concerned for my education. However, most of the time these layouts fit quite comfortably into one of a very few standard formats. For example: Liquid, multiple column with no footer Liquid, multiple column with footer Fixed width, centred Rather than starting out with blank CSS and (X)HTML documents every time you need to build a layout, you can fairly quickly create a bunch of layout starting points, that will give you a solid basis for creating the rest of the design and mean that you don’t have to remember how a three column layout with a footer is best achieved every time you come across one! These starting points can be really basic, in fact that’s exactly what you want as the final design, the fonts, the colours and so on will be different every time. <!
CSS Three Column Liquid Layout by Mani Sheriar This is a three-column layout where the side columns are fixed-width and the center column is liquid. The background, header, main column, left column, right column, and footer are all capable of being different colors (or backgrounds), and it does NOT matter which column is longest. This is an example of the center column being the longest. This is an example of the center column being the longest. This is an example of the center column being the longest. This is an example of the center column being the longest. This is an example of the center column being the longest. This is an example of the center column being the longest.
Web Design — Div Problems, CSS positioning of div tags, height tweaks Tables or Div? The <div> tag can be very useful, but it's important to keep in mind what div stands for: division. The div tag is supposed to divide the page into parts, and it does this extremely well. Of course, you can go all the way, like we did, but we don't recommend that, for one main reason: Div tags only expand to fill their container blocks horizontally, unless they are being sized against another absolutely sized element. However, since that required the use of iframes, which we've since abandonned, the redesign of the site required a new method. This method does not require the ugly hacks most others you'll see out there do, like using background images to make fake columns and borders. Tables of course default to the behavior of all cells adjusting to the content of the other cells, (acting like a unified connected whole, that is), and can only be stopped from doing it by applying special styles to them. Div tags serve very well for the following purposes: