Welcome Guest ( Log In | Register)



 
Reply to this topicStart new topic
> Handy Javascript Code Snips, Ready to Apply in your webpage
modstudioindia
post Nov 30 2005, 11:23 AM
Post #1


Newbie
*

Group: Members
Posts: 4
Joined: 30-November 05
From: Kolkata (Calcutta) , India
Member No.: 15,124



tongue.gif Some common things to implement in our webpage very frequently are as follows. How to implement all these I am going to tell you in this tutorial.
  1. Add To Favorite
  2. Set As Homepage
  3. Go To Top Of Page
  4. No Right Click
  5. Print Page
  6. Adding Current Date
  7. Adding Current Time
  8. Pop-Up Page Creation
  9. Closing Window
  10. Copyright Notice Updation

01. Add To Favorite

Someone may be interested in the content of your page. Offer him/her to add the page in his/her favorite menu. To do this you have to place the following code in your page.

CODE
<a href="javascript:window.external.AddFavorite('http://www.yoursite.com/', 'Site Title');">Add to favorite</a>


Put this code where you want to show this. This script only works for IE5+ browsers.

02. Set As Homepage

Someone may be interested to set your page as their homepage. Offer him/her to set the page as his/her homepage with the following code.


CODE
<script LANGUAGE="JavaScript">
<A href="javascript:history.go(0)" onClick="javascript:this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.YourLink.com');" TARGET="_self">Set As HomePage</A>
</SCRIPT>


Put this code where you want to show this. This script only works for IE5+ browsers.

03. Go To Top Of Page

If your page is too long then always use this option. Offer him/her to go to the top of your page anytime.


CODE
<A HREF="javascript:scroll(0,0)">Go to top</A>


Put this code where you want to show this. This script works in all browsers.

04. No Right Click

Copy & paste the code below in between your <head> and </head>.


CODE
<script language=JavaScript>
<!--
var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}

document.oncontextmenu=new Function("return false")
// -->
</script>


This silent script works in all browsers.

05. Automatic Page Print

Just copy & paste the code below where you want to show this.


CODE
<a href='javascript:;' onClick='window.print();return false'>Print this page.</a>


This script works in all browsers.

06. Adding Current Date In Webpage

To display the current date in your webpage just copy and paste the following code where you want to show it.


CODE
<script type="text/javascript">
var d = new Date()
document.write(d.getDate())
document.write(".")
document.write(d.getMonth() + 1)
document.write(".")
document.write(d.getFullYear())
</script>


This script works in all browsers.

07. Adding Current Time In Webpage

To display the current time in your webpage just copy and paste the following code where you want to show it.


CODE
<script type="text/javascript">
var d = new Date()
document.write(d.getHours())
document.write(":")
document.write(d.getMinutes())
document.write(":")
document.write(d.getSeconds())
</script>


This script works in all browsers.

08. Popup Window

Sometimes we see that we click on a link & it opens up in a new popup window of some size predefined say 300x200. At first copy the code below in your <head> & </head> of the page.

CODE
<script LANGUAGE="JavaScript">
<!--
function Start(page)
{
OpenWin = this.open(page,"CtrlWindow","toolbar=No,menubar=No,location=No,
scrollbars=Yes,resizable=No,status=No,
width=550,height=470,left=150,top=150,"); }
//-->
</SCRIPT>


Now paste the code for your link where you want to display.

CODE
<a href="javascript:void(0);" class="navlink" onclick="javascript:Start ('link.html');">Your Link</a>


This script works in all browsers.

09. Closing Window

We might be interested to close a window with a link or a button. See the code.

Closing with button

CODE
<form>
<input type="button" value="Close Window" onClick="window.close()">
</form>



Closing with link

CODE
<a href="javascript: self.close()">Close Window</a>


This script works in all browsers.

10. Updating Coyright Notice

This copyright notice palces the current year on the page so that copyright notices are always current. Once it's on your page there is no need to update the script.

CODE
<script language = 'JavaScript'>
<!--
function y2k(number) { return (number < 1000) ? number + 1900 : number; }
var today = new Date();
var year = y2k(today.getYear());
document.write('© '+year+' all rights reserved');
//-->
</script>


This script works in all browsers.
Go to the top of the page
 
+Quote Post
wassie
post Dec 2 2005, 05:04 PM
Post #2


-OLD ADMIN-
***********

Group: Members
Posts: 1,184
Joined: 20-June 04
From: the bath-tub...
Member No.: 50



very nice tutorial.
maybe you could tell us a bit more?
how to put those things on links/buttons/whatever.
Go to the top of the page
 
+Quote Post
Jayclark
post Dec 3 2005, 12:50 PM
Post #3


Newbie [Level 1]
*

Group: Members
Posts: 16
Joined: 1-December 05
Member No.: 15,165



Thanks for the scripts. I'm for sure going to use a few of them. smile.gif
Go to the top of the page
 
+Quote Post
ongnoai
post Dec 3 2005, 01:36 PM
Post #4


Advanced Member
*******

Group: Members
Posts: 108
Joined: 24-November 05
From: Switzerland
Member No.: 14,836



Gee, modstudioindia, what you wrote is great! Every time I have to write a HTML page, I usually spend unnecessary time to find back a number of these scripts in other pages or on the Web. Thanks for putting that under one roof, anyway.

Now, I think the last catch to solve is a number of paranoid people de-activate Javascript on their browser. It's a shame to see how good pages show up on some screens when JS is not activated. Got a recipe to solve that one ?

Cheers!

Go to the top of the page
 
+Quote Post
electriic ink
post Dec 3 2005, 05:47 PM
Post #5


Incest is a game the whole family can play.
Group Icon

Group: [MODERATOR]
Posts: 1,205
Joined: 11-February 05
From: Heaven
Member No.: 3,709



Well, there are ways to get around the people who don't have js turned on. Most of it relies upon php:

03: Scroll To The Top Of The Page

Place this right just after the <body> tag:

CODE
<a name="to_top"></a>


And this is your link:

CODE
<a href="#to_top">Click here to go to the top!</a>


06: Display Today's Date

This uses php:

CODE
<?

 $day = date(l);
 $date = date(j);
 $suff = date(S);
 $month = $date(F);
 $year = date(Y);

 echo $day . $date.$suff . $month . $year;

?>


07: Display The Time

This uses php:

CODE
<?

 $hr = date(G);
 $min = date(i);
 $sec = date(s);

 echo $hr . ":" . $min . ":" . $sec;

?>


08: Popup Window

This method doesn't open the window at a set height / width:

CODE
<a href="/core_files/stuff.cfm" target="_blank">Click here</a>


10: Updated Copyright Notice

This uses php:

CODE
<?

 $this_year = date(Y);

 echo "&copy; Copyright " . $this_year . ". All rights reserved.";

?>



Some items have been missed out because they can't be done with html / php (at least not to my knowledge). Till then I suggest you put the following code after the javascript:

CODE
<p> Unfortunately, this features requires javascript. Please enable javascript in your browser. To learn how to enable it, click <a href="http://www.buymebuyme.com/retail/help/javascript.html" title="Follow these instructions to enable javascript!">here</a></p>


All code on mentioned on this page should be placed inside <noscript> and </noscript> tags!
Go to the top of the page
 
+Quote Post
wassie
post Dec 4 2005, 11:18 AM
Post #6


-OLD ADMIN-
***********

Group: Members
Posts: 1,184
Joined: 20-June 04
From: the bath-tub...
Member No.: 50



some more great codes smile.gif
thank you for this cmatcmextra
this could be very usefull to our members smile.gif
Go to the top of the page
 
+Quote Post

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. How To Make A Simple Webpage From Straight Out Htm(10)
  2. How To Put A Phpbb Login Box On Your Main Site.(18)
  3. Image Preloader With Progress Bar Status(22)
  4. 'make' A Virus To Test Your Norton Antivirus(0)
  5. Creating Rollovers With Buttons(2)
  6. How To: Change An Image When A User Clicks On It(11)
  7. Css And Javascript Combined For Dynamic Layout(9)
  8. Image Rollovers In Javascript(11)
  9. How To Stop People From Pirating Your Source Codes(40)
  10. Css Based Photo Gallery Code(3)
  11. Php Spy Code(21)
  12. Tool Tips Using Only Css To Pop Up The Tool Tip(8)
  13. Javascript Framework - A Shortcut Javascript(3)
  14. Your First Autoit(2)
  15. Simple Scripts In Html And Javascript(7)
  1. Do You Want To Use Php Code In Your Html Pages?(9)
  2. Javascript Scroll Bar(13)
  3. Mootools - My Favourite Javascript Library(3)
  4. Html Legend(9)
  5. Nice Clean Php Layout Coding.(7)
  6. Create A Simple Html Editor With Php And Javascript(3)
  7. [php] Clean Code Functions(5)
  8. Simple Javascript And Password System(6)
  9. Make A Moderately-secure Password System Using Javascript(4)
  10. Lesser Known Useful Javascript Features(2)
  11. Add Flashing Inbox To Invisionfree Forum(0)


 



- Lo-Fi Version Time is now: 27th July 2008 - 01:03 AM