UI, CSS « Kurinchi Blogger Scribbles …

Archive for the ‘UI, CSS’ Category

Nov
17
2009

Firefox: Developer Friendly Browsing Tool

Firefox is one of the best tool available for web developers which equips the developer with code testing and debugging capabilities.

There are many useful firefox options and extensions that comes in handy during software development life cycle and in this article we will be listing few of useful plugins that we commonly use.

To find information related to the page that is getting displayed on the browser click Tools > Page info. This will give you permission settings of a page, security identity of the page, feed url and other page specific information like page content-type, encoding, meta tags used, cookie permission settings etc.

Web Developer extension
Added as a toolbar in firefox, this extension gives CSS related information, page information, outlines page elements, tab index, gives topographic information and many such details.
(more…)

Tags: colorzilla, css viewer, developer tools, FireBug, firefox, firefox browser, firefox extensions, Live HTTP Headers, measureit, web developer extension, yslow
Posted in Free Download, General, HTML, UI, CSS | No Comments »

Oct
03
2009

Javascript Memory Leak Diagnosis

What is meant by Memory leak?
Memory leakage refers to obtrusive memory handling techniques adopted in programs which leads to increased load time and poor performance.

Various scenarios can cause memory leaks which can range from unhandled memory garbage to cyclic references to error in code logic. One best suggestion given in the javascript forums to overcome this problem is to nullify the element once its usage is over.
(more…)

Tags: firefox, IE leak, IE leaks, javascript, javascript tools, leak monitor plugin, memory leak, memory leak diagnosis
Posted in General, UI, CSS | No Comments »

Oct
01
2009

Javascript code organization for optimized performance

Knowing how javascript code gets executed in a browser will help us organize the libraries or functions for better performance.

Javascript unlike the server side scripting languages like PHP, ASP, Perl is not compiled at the server side. It is sent as-is from the server to the browser client and it is the browser that interprets the code at the client side.

The total size of the Javascript code and its organization will have a significant effect on the pages served at the client side which in turn will affect the performance of the page.

Organize the libraries in such a fashion that you only have the needed functions associated with the page. You can consider this point right at the time of creating your template pages. This will reduce the number of javascript pages that are called from one page. (more…)

Tags: extjs, javascript framework, javascript performance, jQuery, prototype, scriptaculous
Posted in General, UI, CSS | No Comments »

Sep
05
2009

How to open ALL external web sites or references in a NEW window?

Using JQuery to open external links in new windows

Earlier we used to write a string of code in javascript to enable opening external references in a new window in addition to modifying the html code

With JQuery, this can be done with one line of code as shown below

$(document).ready(function(){
    $("a[@href^='http']").attr('target','_blank');
});

The above line checks for occurences http in a tag and if a link has “http” in it, JQuery opens the link in a NEW window.

According to W3C standards, the target attribute has been removed from xhtml 1.1 specification.

Sample script to open external links in New Window

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB">
<head>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script language="javascript">
$(document).ready(function(){
    $("a[href^='http']").attr('target','_blank');
});
</script>
</head>
<body>

Testing the pages - Open Links in new <a href="http://yahoo.com">window</a>.

<h1><a href="http://www.kurinchilion.com">Kurinchilion</a></h1>
</body>
</html>

Tags: external links new window, http links new window, jQuery, new window open, UI, CSS, xhtml
Posted in HTML, UI, CSS | No Comments »

Jul
28
2009

Free Fugue Icons under CCA License

If you are a web designer or a programmer with a sense of site aesthetics, visit Pinvoke.com which has a HUGE! collection of icons (as of this writing 2225 icons) in PNG format distributed under Creative Commons Attribution License.

Yusuke Kamiyamane has given a thought in developing this extensive set of icons which will definitely be a handy collection in structuring the sites. Kudos to Yusuke.

Tags: cca, free icons, icons, png icons, royalty free icons
Posted in UI, CSS | No Comments »

Jun
28
2009

PHP: Buffer Overflow

PHP Program Flow
A call that is made to execute a sequence of code in PHP program is sent to PHP core library written in C programming language which in turn would talk with the underlying operating system to get the results of its execution.

What is buffer?
A buffer is a temporary memory location to hold data for faster program execution time. The data may be stored as a heap or as a stack. Stack can be visualized as a FILO array of data and heap as a linked list of data.

Why we need to take care of buffer overflows?
Programmers who know about certain loop holes can exploit this feature in by pointing a record in the heap or stack to prewritten block of hackable code. These are called buffer overflow attacks.
(more…)

Tags: buffer attacks, buffer overflow, PHP
Posted in PHP, UI, CSS | No Comments »

Jun
11
2009

JQuery: Showing a progress image while processing background task

I thought to write a simple example to show a progress bar or a gif image showing a that a task is happening at the background using a jquery function.

i) Include jquery script file in the header section and the following code in the head

<script language="javascript">
$(document).ready(function(){
    $('#progress').hide();
    $("#main a.bgdiv").click(function(){
        $("#progress").show("slow");
        $("body").load($(this).attr('href'));
        return false;
    });
});
</script>

(more…)

Tags: background task, jQuery, jquery a href linking, progress bar
Posted in Tips, Tricks, Guides, UI, CSS | No Comments »

Jun
09
2009

cakePHP: Session enabled messages using Session->setFlash

There are different ways to flash or publish the messages for a user action. Usability plays a major role in determining how the navigation pattern for a web application takes place.

publishing the outcome of user action on the same page
designing a single page to flash all success, error, warning, notice level messages
designing a separate page for each message that gets published for the user

(more…)

Tags: cakePHP, layouts, Session messages, Session SetFlash
Posted in HTML, PHP, UI, CSS | 1 Comment »

Jun
06
2009

jQuery extension Impromptu

This is an easy and elegant way to prompt user messages or to seek user inputs. The author of this tool had cleanly explained its various usage by giving examples which is again easy to follow.

Check out the extension at http://trentrichardson.com/Impromptu/index.php

Tags: Impromptu, javascript extension, jQuery
Posted in General, UI, CSS | No Comments »

May
21
2009

CSS FIR Technique explained

FIR stands for Fahrner Image Replacement named after Todd Fahrner.

It is a standard compliant technique in which <h1> and <span> tags are used to have nice headings and highlights.

Key fact in this technique is that the text will get displayed even if the CSS is disabled for some reason, hence presenting the text beneath it.
(more…)

Tags: CSS, Fahrner Image Replacement, FIR, quirksmode, sIFR
Posted in UI, CSS | 1 Comment »

M	T	W	T	F	S	S
« Aug
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30

Kurinchi Blogger Scribbles …

On Open Source Technologies

Archive for the ‘UI, CSS’ Category

Firefox: Developer Friendly Browsing Tool

Javascript Memory Leak Diagnosis

Javascript code organization for optimized performance

How to open ALL external web sites or references in a NEW window?

Free Fugue Icons under CCA License

PHP: Buffer Overflow

JQuery: Showing a progress image while processing background task

cakePHP: Session enabled messages using Session->setFlash

jQuery extension Impromptu

CSS FIR Technique explained

Categories

Archives

StatPress

Recent Posts

Tags