1. Add Images to webpage

One thing I see alot’ve when I look at webpage programming language is images that are on the page but not shown always. Like sometimes they only get shown if something happens. Like if you click on something. But instead of having that image on the website always, you can add it with javascript.

function myAddImageFunction(myImageLocation) {
   var myImage = new Image();
   myImage.src = myImageLocation;
   document.body.appendChild(myImage);
}
myAddImageFunction('hello.jpg');

2. Creating a “Database”

Have you ever had a lot of variables that were very similar? Like maybe you want to add a BUNCH of images to your websight? Then this code might look familiar to you

var var1 = "image1.jpg";
var var2 = "image2.jpg";
...
var var10 = "image10.jpg";
var myImage1 = new Image(); myImage1.src = var1;
var myImage2 = new Image(); myImage2.src = var2;
var myImage3 = new Image(); myImage3.src = var3;

Well its possible to create a “database” in javascript which can reduce the amount of code you need to write. by doing this

var vars = new Array("image1.jpg", "image2.jpg", "image3.jpg");
var myimages = new Array(new Image(),new Image(),new Image());

Then you access the array by using “[]”

myimages[0].src = vars[0];
myimages[1].src = vars[1];
myimages[2].src = vars[2];
...
myimages[3].src = vars[3];

Overall this is and improvement

3. Google Maps

One thing everyone wants on their webpage is google maps. Google maps can tell you where your webpage is in cyberspace. Most people think that you need to use google to google maps something but you don’t.

Actually I couldn’t get this one working but i’ve seen other people do it.

4. Enhanced Security

Now and Days, you have to log in to a website to use it. This means having two inputs on your website. One for username. One for password. To set that up you would do this

<input type="text" name="username" />
<input type="text" name="password" />

The problem with that programming is that when people type into the password box, their password is visible! So how do websites solve the issue? Usually they use .net or php but in fact you can do this with jqueryscript.

var mypassword = "";
$('input[name=password]').keyup(function (e) { 
  mypassword = mypassword + e.key;
 if (mypassword.length==1) {
 $(this).val("*");
 } else if (mypassword.length==2) {
 $(this).val("**);
 } else if (mypassword.length==3) {
 $(this).val("***);
 } else if (mypassword.length==4) {
 $(this).val("****);
 } else if (mypassword.length==5) {
 $(this).val("*****);
 } else if (mypassword.length==6) {
 $(this).val("******);
 } else if (mypassword.length==7) {
 $(this).val("*******);
 } else if (mypassword.length==8) {
 $(this).val("********);
 } else if (mypassword.length==9) {
 $(this).val("*********);
 }});

5. User Retention

Do you know what the #1 reason for losing users is? Closing the window. This is devastating to your site views so how to keep people from closing the window?

window.addEventListener(“beforeunload”, function (e) {
 var confirmationMessage = “stay a while!”; (e || window.event).returnValue = confirmationMessage;
 return confirmationMessage;
});

this will ask them to confirm if they REALLy want to leave or if they were just trying to make you jealous. I find it has about a 50 % success rate.