Category: Misc

5 Resources for Free PNG icons

Posted by Alaa Badran in Design, E-Commerce, Misc. 1 Comment

9th April

I have collected 5 resources for free PNG icons. They could be used on websites, mobile applications and other stuff.
They are available with multi-dimentions as follow:


1) 25 Glossy iPhone style icons

These icons are available with PSD file. Free to download.

15 Free IDEs for Developers

18th March

Komodo Edit (Windows, Mac, Linux)

Komodo Edit is an open source application that has support for PHP, Python, Ruby, JavaScript, Perl, Tcl, XML, HTML 5 and CSS 3.

It has syntax coloring, folding, background syntax checking,  auto-complete and calltips. It also includes libraries for autocompletion for jQuery, Ext JS, Ruby on rails and more.

I just recommend Komoodo Edit.

jQuery: Catch Keyboard Events

18th June

Lot of jQuery projects relies on keyboard/mouse event like pressing “p” for previous and “n” for next also using the arrows.

Because this is important, I have managed a code to get the keyboard character on 3 events:
– Keypress
– Keyup
– Keydown

I have created a function to return the key as below:

function getKey(key){
if ( key == null ) {
keycode = event.keyCode; // To Mozilla
} else {
keycode = key.keyCode;
// Return the key in lower case form
return String.fromCharCode(keycode).toLowerCase();

Now let’s use the events:

$(document).keypress(function (eh){
alert(“Keypress: The key is: “+getKey(eh));

$(document).keyup(function (eh){
alert(“Keyup: The key is: “+getKey(eh));

$(document).keydown(function (eh){
alert(“Keydown: The key is: “+getKey(eh));

To see an exaple of this code, please check the … Read More »

Scroll window smoothly using jQuery

26th March

Using jQuery animate() function to do a smooth scrolling:

I have also created a div as follow:

<div id=”scrollToHere”>
Scroll to here

You need something to run your script. Create a button like this:

<input type=”button” onclick=”scollWin();” value=”Scroll up” />

The jQuery Code will be like this:

function scrollWin(){
scrollTop: $(“#scrollToHere”).offset().top
}, 800);

Here is something to try:

now jQuery window scrolling is done with animation.

Enjoy it..

Web page transparency for all browsers

Posted by Alaa Badran in Browsers, CSS, Design, DHTML, Misc, Web & Programming, XHTML. 1 Comment

8th February

Every browser has different CSS properties for less-used actions like: transparency or opacity.
It was something weird to do transparency on your web page because there are lot of different web browsers. To make that easy, I have collected information and generated a CSS class that will work on most of the browsers.
See the Code below:

.transparent {
-khtml-opacity: 0.75;
opacity: 0.75;

filter:alpha(opacity=75); is used for Internet Explorer.
-moz-opacity:0.75; is used for Mozilla, Firefox, Netscape browsers (old versions).
-khtml-opacity: 0.75; is used for old versions of Safari.
opacity: 0.75; is used as a standard CSS property for browsers like Firefox 2+ and Safari 3+ and Opera