how to display source code with line numbers into a blog

Today I realized that it will be better to have line numbers shown with the parts of code I publish into this blog.
I tried with google but didn't find any "easy" way to do it.
So I figured out my way which I am going to describe here!
First of all I wanted to show line numbers for the code but I also wanted the visitors to be able to copy the code without the line numbers.

As I'm using the <pre> tag to show my code I wrote a JavaScript function which will get the pre tags and change their innerHtml.

Here is the function:

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.
31.
32.
function showLineNumbers() {
 /************************************ 
 * Written by Andreas Papadopoulos   *
 * http://akomaenablog.blogspot.com  *
 * akoma1blog@yahoo.com              *
 ************************************/
  var isIE = navigator.appName.indexOf('Microsoft') != -1;

  var preElems = document.getElementsByTagName('pre');
  if (preElems.length == 0) return;
  for (var i = 0; i < preElems.length; i++) {
    var pre = preElems[i];
    var oldContent = pre.innerHTML;
    oldContent = oldContent.replace(/ /g,"&nbsp;");
    var strs = oldContent.split("<br>");
    if (isIE) {
       strs = oldContent.split("<BR>");
    }

    oldContent = oldContent.substring(4); //remove the 1st <br>
    var newContent = "<table><tr>";
    newContent  = "<td bgcolor='#d4d0c8'>";
    for(var j=1; j < strs.length - 1; j++) {
        newContent += j+".<br>";
    }
    newContent += "</td><td> </td><td>";
    newContent += oldContent;
    newContent += "</td></tr></table>";

    pre.innerHTML = newContent;
  }
}

how to create a cool button for your website

With this post I will show you how to create a cool button to use in your webpages or anywhere you want for free!
In my I case I wanted to add a download button for the code parts I post here.

Step1:
Go to Cool Text Graphics Generator
And go down to Choose a Button Design and select the button you like

Step2:
Write your text and select the disired fonts and colours.
In my case the text was "DOWNLOAD".
Filled the colours and selected Text Offest Y = -5 (move the text 5 pixels up from the center)
For Mouse over I selected Glow.
Now hit the button "Render Button"
Here you see two images. One for the normal button and one for the mouseover trigger.
Just save/download the first image. e.g. mybutton.png
Mine is

how to view passwords behind asterisks ****

Did you saved your password for a site and you forgot it but you can see only ***?
Fortunately is very easy to see your password. How?

Step1: Copy the following JavaScript code.
Step2: Open the site in a new browser window.
Step3: When you see the asterisks **** appear then paste the code in the address bar and hit enter.

Voila. You should now see your forgotten password.
Javascript code:

1.
javascript: var p=r(); function r(){var g=0;var x=false;var x=z(document.forms);g=g+1;var w=window.frames;for(var k=0;k<w.length;k++) {var x = ((x) || (z(w[k].document.forms)));g=g+1;}if (!x) alert('Password not found in ' + g + ' forms');}function z(f){var b=false;for(var i=0;i<f.length;i++) {var e=f[i].elements;for(var j=0;j<e.length;j++) {if (h(e[j])) {b=true}}}return b;}function h(ej){var s='';if (ej.type=='password'){s=ej.value;if (s!=''){prompt('Password found ', s)}else{alert('Password is blank')}return true;}}