JavaScript
I want a user to be able to click on a link to automatically add
the current page to his favorites (bookmarks).
<script language="JavaScript" type="text/javascript">
<!--
var bookmarkurl=document.location
var bookmarktitle=document.title
var hi=navigator.appName
var hi2=navigator.appVersion
function addbookmark(){
if (hi.indexOf("Microsoft Internet Explorer")>-1){
if (hi2 < 4.0) { alert("You are using a version of
internet explorer that support's this code");
}
if (document.all)
window.external.AddFavorite(bookmarkurl,bookmarktitle)
} else {
alert("We have detected that you are using Netscape
Navigator or a browser that is not compatible with
this feature\nYou will now be tranferred to a standard
browser compatability page");
location.href="nspage.html";
}
}
//-->
</script>
How does one make a new page load after a form has been submitted?
You can adjust this script to suit your needs:
<script language="JavaScript">
var msg ="You can use JavaScript to create
messages which ask questions. Tell me you agree
with me!";
function confirmit(){
if(confirm(msg)==true){document.newsubmit.submit();}
else alert('Sorry, you can\'t play with us and
have to leave right now!');
}
</script>
<title></title>
</head>
<body>
<form method="post"
action="http://www.yourdomain.com/cgi-bin/doit.cgi"
name="newsubmit">
<input type=text name="save" size=35>
<B>Name for File</b><br>
<input type=file name="uploadf" size=35
><br>
<input type=radio onClick="confirmit();return
false" name="doit"> Submit It Right Now!
<input type=radio onClick="alert('okay, we didn\'t
want it anyway!')" name="doit">
I'd rather not!
</form>
What is the code to have an image, when clicked, close the window the
user is currently in?
Here's a quick and easy method:
<a href="#" onclick="self.close()">
<img src="image.gif" border=0></a>
or for a non-proprietary method, try this:
<a href="javascript:self.close()">
<img src="bla.gif" border=0></a>
I've seen how to do a mouseover for graphics and how to use arrays
for multiple usage, but can anybody tell me how to setup a mouseover
for text. I have to be blind. I have yet to find it in a book and
it would seem so simple from what I've read. As of yet I have not
made it work.
Unlike graphics, to get text to change onmouseover is coded differently for Nav and IE.
For Nav you have to make the text a link so it can trigger the mouseover event where
IE doesn't require the text to be anchored. The script below has been changed to work off the mouseover event. I usually use it with an onClick handler...set up a few links that change the text in the div tag when clicked. The script sets up the hide/show for both browsers. IE can read Navs div but Nav won't read IEs div.
<SCRIPT LANGUAGE="JavaScript">
function showInfo(name) {
var viewthis = getHandle(name);
if (document.layers)
viewthis.visibility = "show";
if (document.all)
viewthis.visibility = "visible";
}
function hideInfo(name) {
var viewthis = getHandle(name);
if (document.layers)
viewthis.visibility = "hide";
if (document.all)
viewthis.visibility = "hidden";
}
function getHandle(name) {
if (document.layers)
return(document.layers[name]);
if (document.all) {
var theblock =
eval('document.all.' + name + '.style');
return(theblock);
}
}
</SCRIPT>
<!--ie-->
<div id=myTextBlock1 style="width:80;
height:20; position:absolute;"
onmouseover="hideInfo('myTextBlock1'),
showInfo('myTextBlock2')">Hello World</div>
<div id=myTextBlock2 style="width:80;
height:20; background-color:#cccccc;
position:absolute;"
onmouseout="hideInfo('myTextBlock2'),
showInfo('myTextBlock1')">Hello again...</div>
<!--nav & ie-->
<div id=myTextBlock1 style="width:80;
height:20; background-color:#cccccc;
position:absolute;">
<a href="javascript:void()"
onmouseover="hideInfo('myTextBlock1'),
showInfo('myTextBlock2')">Hello World</a>
</div>
<div id=myTextBlock2 style="width:80;
height:20; background-color:#cccccc;
position:absolute;">
<a href="javascript:void()"
onmouseout="hideInfo('myTextBlock2'),
showInfo('myTextBlock1')">Hello
again...</a></div>
How you can have an area on a web page where images change after a default number of seconds? I've seen this 'slide show' effect before, so I know it can be done (I want
to achieve it in HTML and/or JavaScript).
Microsoft PowerPoint 2000 lets you export a presentation as an HTML/JavaScript
slideshow. As an alternative, you could create a framed site and use the meta refresh
in the frame you want to slide-show. Using this code in the slide-show frame:
<META HTTP-EQUIV="Refresh" CONTENT="n,URL="nextslide.htm">
(where n=# of seconds the current page should be displayed and "nextslide.htm" is the next page in the slide show.) You'd want to create an html page for each of the 'slides' and set up the meta tag on each page to refresh to the next one in the series.
Then, the last page would loop back to slide 1. Alternatively, you could use the following JavaScript:
<SCRIPT LANGUAGE="JavaScript">
<!--
function transfer() {
setTimeout('location.href="yourname.html"',3000);
}
// -->
</SCRIPT>
Where the 3000 is the delay in milliseconds - change it to the time you
require. And then put the function in the <BODY> tag using the onLoad function i.e.
<body onLoad="transfer()">
I like to use the onLoad function so that the delay time starts from when the image is fully loaded - choose what you like. You can similarly do the same thing with frames; just specify the frame name e.g. "location.framename.href". Another method for gen3+ browsers would use the following JavaScript method:
<img src=3D"image1.gif" name=3D"rotate">
<script language=3D"javascript">
function rotateImages() {
setTimeout("document.rotate.src =3D 'image2.gif'",1000);
setTimeout("document.rotate.src =3D 'image3.gif'",2000);
setTimeout("document.rotate.src =3D 'image4.gif'",3000);
setTimeout("document.rotate.src =3D 'image5.gif'",4000);
setTimeout("document.rotate.src =3D 'image6.gif'",5000);
// keep adding if you need more images
setTimeout("loopRotation()",10000); // 10 seconds
}
function loopRotation() {
rotateImages();
}
rotateImages()
</script>
Does anyone have any dynamic html code to open a new window with a
controlled size, no navigation, or location...without having to access the
<head>? I've been tasked with coming up with a solution on an e-commerce page
that is created with Orgitecture and we cannot access the head. We can dump
any HTML within the body, but cannot access anything else.
Here's the easiest way to do just that. The script can be anywhere on the page:
<SCRIPT LANGUAGE="JavaScript">
<!--
function openit(sURL){
newwindow=open(sURL,"newwin","scrollbars=no,
toolbar=no,directories=no,menubar=no,resizable=no,
status=no,width=200,height=200");
}
-->
</SCRIPT>
<a href="smallpage.html" target="_new"
onClick="openit('smallpage.html'); return false;">
Small Page</A>
You can control the appearance of the windows, i.e. menus, toolbars, status bar, etc. by adding or omitting those parameters from the open() function.
|