Learn HTML Code » Javascript Codes http://www.thosecodes.com HTML Codes and Tutorials the Easy Way Sun, 24 Jan 2010 22:57:16 +0000 http://wordpress.org/?v=2.8.6 en hourly 1 No Right Clicking on your Website http://www.thosecodes.com/no-right-clicking-on-your-website/#utm_source=feed&utm_medium=feed&utm_campaign=feed http://www.thosecodes.com/no-right-clicking-on-your-website/#comments Sat, 05 Sep 2009 07:31:01 +0000 Zach http://www.thosecodes.com/?p=53 Do you have an image you want to try and protect beyond placing a watermark on it? You can put javascript into your source to tell the user they cannot right click on your web page. This script is not unbeatable, but most Internet users will not know how to get around the script. There will always be a way for people to grab what they want from your website. The only bulletproof way to keep your material and images from being taken from your site is to simply not put them up at all.

However if you want some security then you can copy and paste this code into your source:

<body oncontextmenu=”alert(’You may not right click’); return false;”>

If you want to change what is displayed when the user right clicks just change the area that says ‘You may not right click’. Only change the text in this area, do not change anything else.

]]> http://www.thosecodes.com/no-right-clicking-on-your-website/feed/ 0 Roll over image using Javascript http://www.thosecodes.com/roll-over-image-using-javascript/#utm_source=feed&utm_medium=feed&utm_campaign=feed http://www.thosecodes.com/roll-over-image-using-javascript/#comments Sat, 05 Sep 2009 07:30:16 +0000 Zach http://www.thosecodes.com/?p=51 Creating a roll over image with javascript is not as efficient as a roll over image with CSS, but it is a lot easier to implement. There is more code involved in doing a roll over image with javascript, but you can copy and paste it rather then having to create your image and style your CSS. The script code that you will need in your head is (If you are copying and pasting this code and it does not work please re-write the quotations):

<script type=”text/JavaScript”>
intImage = 2;
function swapImage() {
switch (intImage) {
case 1:
IMG1.src = “images/roadpic.jpg”
intImage = 2
return(false);
case 2:
IMG1.src = “images/propel1.jpg”
intImage = 1
return(false);
}
}
</script>

Where I have “images/roadpic” and “images/propel1″ is where you will want to put the path for your images. The first image, roadpic, will be the image that is displayed normally on the page. The second image, propel1, is the image that will appear when the mouse hovers over the image. The body code to create the roll over image would look like this:

<img id=”IMG1″ name=”IMG1″ src=”images/roadpic.jpg”
onMouseOver=”swapImage();”
onMouseOut=”swapImage();” alt=”imageswap” class=”test” width=”890″ height=”301″>

Now you have a working Javascript roll over image. Remember when using this that it may take your visitors a while to see the roll over effect because the image that is being swapped is not pre-loaded onto the page. This means that when the mouse is hovered over the image, it asks the server for the new image it is supposed to display and then it displays it. If you want instant roll overs you would need to make a roll over image using CSS or put more javascript into your page to load all the pictures the user will need when he/she loads the page. If your visitors do not have Javascript enabled for their browser then they will not be able to see this roll over image.

]]> http://www.thosecodes.com/roll-over-image-using-javascript/feed/ 0