Design, CG Graphics & Inspiration

Layout of Stretchy Websites

Layout of Stretchy Websites

In this article I will share with you a technique for laying out stretchy websites (actually, I have found out that I cannot make non-stretchy ones), which I’ve been using for the last 2-3 years. This technique, which can be used for creating sophisticated modular grids, is easy to use but somewhat difficult to understand, and it does have some drawbacks. Basically, this article might be useful for web designers too, as website layout should be correctly designed before actual coding is done.

Read more…

  • January 9, 2010,
  • Splashnology Editors

15 Awesome Free JavaScript Charts

15 Awesome Free JavaScript Charts

Plotting your data can serve as a replacement to tabular data, and is also a great way to add practical graphics to your web page or application. There are many ways you can plot data, but here I have included 15 Awesome Free JavaScript Charts In Your Sites/Blog Pages which serves as a easy Charting solution. Hope you like it.

Read more…

  • January 6, 2010,
  • Splashnology Editors

CSS3 transitions and 2D transforms

CSS3 transitions and 2D transforms

For richer user interfaces it is often desirable to include some animation to make an effect smoother or more appealing, or effects such as rotating elements and text. Traditionally in HTML pages the primary means to add animations was to use JavaScript to adjust the desired CSS property value over a given period of time. This works but can be slower as the JavaScript code is not hardware or software accelerated. What’s more, using JavaScript for animations creates more code to maintain. It has not been possible to apply effects such as text at an angle without resorting to using images or SVG.

Read more…

  • December 23, 2009,
  • Splashnology Editors

jQuery AutoComplete

jQuery AutoComplete

I’d like to present another jQuery plugin, this time it’s autocomplete with some handy features.

Read more…

  • November 11, 2009,
  • Splashnology Editors

Fixing animation in jQuery

Fixing animation in jQuery

Hi! Initially I was going to write in this article that the jQuery animation engine is rather inefficient and creates a lot of timers, each of them running on its own, which results in the page content being redrawn too often and therefore is very bad for the Web browser’s performance. I was also going to describe some techniques for creating “true” animation. However, while preparing my examples I realized that I was wrong.

Read more…

  • November 8, 2009,
  • Splashnology Editors

Making tabs with dl tag

Making tabs with dl tag

Once I needed to make tabs on the webpage. As it’s a rather routine problem, I didn’t want to reinvent the wheel, so I just googled a little bit to see how people solve it. All the solutions I found looked rather run of the mill, something like that:

Read more…

  • November 4, 2009,
  • Splashnology Editors

Universal Method of Block Decoration

Universal Method of Block Decoration

I asked my readers to think out a technique for laying out blocks with rounded-off corners and shadows. Take a look at the solutions I received, and you will see that most of them are very much alike: four elements in the corners and a somewhat odd-looking result, though there are some differences in block placement. Let’s take a detailed look at the way those techniques work and also find out why this article isn’t simply titled “Creating rounded-off blocks with shadows.”

Read more…

  • November 3, 2009,
  • Splashnology Editors

WordPress Template Designer CheatSheet

WordPress Template Designer CheatSheet

In this post we have put together a useful WordPress Template Cheatsheet to save developers and designers time, energy, and headaches.

Read more…

  • November 2, 2009,
  • Splashnology Editors

Sprites in the web. Part 1

Sprites in the web. Part 1

Nowadays there are a lot of pieces of news about CSS-sprites. However, all resources just crunch the same idea about saving a set of small pictures in the one to increase total page loading speed. This research in two parts will gather all my knowledge about sprites using features in the web.

Read more…

  • October 20, 2009,
  • Splashnology Editors

8 jQuery plugins you will probably want to use

8 jQuery plugins you will probably want to use

This post presents 8 useful jQuery plugins which you can use in your future projects.

Read more…

  • October 10, 2009,
  • Splashnology Editors

How to create 2 floating columns with the same height correctly

How to create 2 floating columns with the same height correctly

I want to share with you my approach to markup of double-columned templates where both columns must have the same height. It seems to be well-known and frequently discussed subject and every web-design resource provide to you at least a few ways to do it. But I must point your attention to one moment that described templates are like “bricks”, i.e. templates with fixed width and maximum one expanding column. I will show how to make two (or more) expanding columns and it will be not emulation like bold colorful border, but real full-scale column for which you can setup your background picture for example.

Read more…

  • June 20, 2009,
  • Splashnology Editors

TableSorter – jQuery plugin

TableSorter – jQuery plugin

TableSorter – jQuery plugin

tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. tablesorter can successfully parse and sort many types of data including linked data in a cell. It has many useful features including:

Read more…

  • May 20, 2009,
  • Splashnology Editors

jQuery iPod-style Drilldown Menu

jQuery iPod-style Drilldown Menu

This drilldown menu provides easy navigation of complex nested structures with any number of levels. The entire menu sits within a fixed-size area, and when a node is selected, breadcrumb links appear above the menu options to both deliver feedback and allow quick access back to nodes higher up in the hierarchy.

Read more…

  • ,
  • Splashnology Editors

Sliding login panel with jQuery

Sliding login panel with jQuery

This script is based on my previous script “Show/Hide Login Panel with Mootools 1.2” but now works with jQuery 1.3.2 instead of Mootools 1.2.

Read more…

  • May 18, 2009,
  • Splashnology Editors

Make Progress / Percentage Bar

Make Progress / Percentage Bar

What is jsProgressBarHandler?
jsProgressBarHandler is a Javascript based Percentage Bar / Progress Bar, inspired upon JS-code by WebAppers and CSS-code by Bare Naked App. Next to a structural rewrite of the WebAppers code, this javascript progress bar can easily be extended and tweaked just by setting a few parameters.

Read more…

  • ,
  • Splashnology Editors

6 Tools To Be An Effective Web Developer

6 Tools To Be An Effective Web Developer

Over the last few years Rails has helped Ruby’s popularity explode. One of the biggest reasons for this is the time that Rails can save you. By working within a well defined framework a lot of development decisions are simplified and it is easier to be more organized. Throw in some great tools like ORM, Unit Testing, Mocking, and more and you have a powerhouse of developer efficiency and quality.

Read more…