Go Around The Tech Corner…

Posts Tagged ‘JavaScript

You can use JavaScript code to redirect user to a page you want. For instance, when a user tries points his/her address bar to http://mywebsite.com, you can have that page automatically redirected to http://www.mywebsite.com using only one line of JavaScript code!

All you need to do is to paste the following code in the <head> section of your html page:

<script language=”JavaScript”>
window.location=”http://www.mypage.com
</script>

This function can also be used to redirect users to appropriate versions of web pages depending on which browser they are using. It’s a very simple and handy script, easy to remember and easy to use. Do comment on any other ways of redirecting a user to another page that you may know of!

–          Millie

Advertisements

You can use JavaScript commands with the onClick parameter in the input tags of an html form. Wow! That sounds like a complicated line eh? Lol…so it very easy to have the background color of a page changed on the click of a button. Just read the script below – it’s fairly easy to understand:

<FORM>
 <INPUT value="Change to Yellow!" onClick="document.bgColor='yellow'">
 <INPUT value="Change to Red!" name="button4"> <br>
 <INPUT value="Change back!" name="button5">
</FORM>

When you include this code snippet in your html page, it will display 3 buttons; one to change the background color of the page to yellow, one to red and the third to change it back to the original one we started with, i.e. white. The only piece of JavaScript you need to remember here is the document.bgColor and once you assign it with a value, you have a ready script that works!

Obviously you don’t have to use JavaScript to change the background color of a page, you could specify the color you want in the <body> tag of your html script like this:

<body bgcolor="red">

The purpose of this tutorial was just to demonstrate the use of the JavaScript function document.bgColor.

I hope this tip was helpful. You can leave a comment if you want me to set my feet on other aspects of this wonderful scripting language! I’ll definitely write a post about it and illustrate its use.

–          Millie

This is a very simple one. JavaScript has inbuilt functions that you just include in your code. See the snippet below:

<html>
<title>Time & Date Display</title>
<head>
<script language = "JavaScript">
var today = new Date()
document.write(today);
</script>
</head>
<body>
Displaying Time Using JavaScript
</body>
</html>

That’s just about it. You declare a variable called today and assign it the Date() function. Then use document.write to display it on your webpage.

–          Millie

On my previous post about how to display alert messages, you’ll see that the messages are specified in quotes within the script. What if you wanted to display user-generated data on the alerts which pop up? How would you do that? You have to first display a form through which you will collect some information. Then in your JavaScript function, you have to call the values you get from the form so that it picks up and displays what the user enters. Here’s a simple example:

<html>
<title>Displaying user data in the alert messages</title>
<head>
<script language = "JavaScript">
function displayalert()
{
alert('Welcome ' + document.FORM1.yourname.value + 
'! Your Age is ' + document.FORM1.yourage.value)
}
</script>
</head>
<body>
Please Enter Your Name & Age in the textboxes Below, 
Then Click on 'Submit'...<p>
<form name = "FORM1">
Your Name: <input type="Text" Name="yourname"><p>
Your Age: &nbsp;&nbsp;<input Name="yourage"><p>
<input type="button" value="Submit" onClick="displayalert()"><p>
<input type="reset" value="Refresh">
</form>
</body>
</html>
 

The form [FORM1] collects the user’s name and age, and the JavaScript function displayalert() uses the document.FORM1.yourname.value to pick that value, which will be displayed in the alert. Notice that the JavaScript function to display the alert is being called from the Submit onClick property.

I hope this tutorial has been explained well, do leave comments on your opinions or if you think I should change something. Happy Programming!

–          Millie

Often you’ll see messages popping up to alert you about something or to give you extra information on something. These can be programmed using JavaScript and it’s very simple. See the code below – It’s easy to understand.


<html>
<head>
<title>Displaying Alerts with JavaScript</title>
<script language = "JavaScript">
<!--
function m_alert()
{
alert('Do not Click..!!!');
alert('I Told You Not To Click Me..!!');
alert('Why Did You Click???!!!');
alert('You Will Never See Me Again!!!');
}
-->
</script>
</head>
<body>
<a href="#" onMouseover = "m_alert()"> Dont Click This Link </a>
</body>
</html>

Simply copy the code above, paste it into a notepad file and save the file with a .html extension, e.g. alerts.html.

The link has a mouseover function which calls the JavaScript funtion when you hover it. When writing JavaScript code, always remember to end the lines of code with a semicolon (;). Try and see how it works! You can use alerts in your websites to pass on certain messages easily.

– Millie

Pop-up windows are helpful when you have that extra information to give away to your readers. Lots of times they are also used for ads or just to display messages for the user, informing them or alerting them about something. It’s very easy to create these pop-up windows using JavaScript.

All you need is a link or a button for instance, which you can click to trigger the pop-up window. You could also choose to have the pop-up displayed when the page to your website loads or when the user starts to navigate away from the website. The trick is to use to the right command.

In this example, I’ll show you how to create a pop-up which appears when the user clicks on a button. Put the following HTML and JavaScript code in the body of the HTML document:

<FORM METHOD="post">
  <INPUT  TYPE="button" VALUE="Click me!"
  OnClick = "popup = window.open
  ('', 'popup', 'width=100, height=100, resizable=no, scrollbars=no');
  popup.document.write('JavaScript!!');
  return true;">
</FORM>

The popup variable is the name of the window that pops up when the user clicks on the button.

The OnClick function takes care of the rest. Try and see if you can make it work!

– Millie


Me – The author of this blog!


This is my tech blog. I got another blog, full of jokes that will crack u up! http://humoraddict.blogspot.com

Follow milliepatel84 on Twitter

Tweet Tweet…!!!!

Blog Stats

  • 43,913 hits

Top Clicks

  • None

Flickr Photos

%d bloggers like this: