JavaScript Source Code 3000: Page Details: Resizable Viewer
Resizable Viewer
Displays a small 'image loading' picture while the main image is loading. When the image completes, the viewer window is appropriately resized, centered on the screen, and 'image loaded' is displayed. Neat!
Pic 1
Pic 2
JavaScript Source Code 3000: Page Details: Resizable Viewer
Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Apple-s). The script is yours!!!
<!-- SEVEN STEPS TO INSTALL RESIZABLE VIEWER:
1. Paste this first code into a new file
2. Save this file as: resizableViewer.js
3. Paste this whole section into a new HTML document
4. Then save this new HTML document as: viewer.html
5. Save this code into the HEAD of your HTML page
6. Copy this code into the BODY of your HTML page
7. Save the image load images to your web server -->
<!-- STEP ONE: Paste this first code into a new file -->
<!-- STEP TWO: Save this file as: resizableViewer.js -->
arImageSrc = new Array ("loading.gif","loaded.gif");
arImageList = new Array ();
for (counter in arImageSrc) {
arImageList[counter] = new Image();
arImageList[counter].src = arImageSrc[counter];
}
var height = screen.height;
var width = screen.width;
var leftpos = width / 2 - 50;
var toppos = height / 2 - 50;
function encode(str){ // Netscape fix thanks to Cyanide_7
return escape(str.replace(/ /g,'+'));
}
function view(what) {
var url = 'viewer.html?pic='+encode(what);
window.open(url,'WIN','scrollbars=no,status=no,toolbar=no,resizable=1,location=no,menu=no,width=100,height=100,left=' + leftpos + ',top=' + toppos);
}
function getParams() {
var idx = document.URL.indexOf('?');
var params = new Array();
if (idx != -1) {
var pairs = document.URL.substring(idx+1, document.URL.length).split('&');
for (var i=0; i<pairs.length; i++) {
nameVal = pairs[i].split('=');
params[nameVal[0]] = nameVal[1];
}
}
return params;
}
params = getParams();
function resize() {
if (eval(pic).height) {
var name = navigator.appName
if (name == "Microsoft Internet Explorer") {
myHeight = eval(pic).height + 40;
myWidth = eval(pic).width + 12;
}
else {
myHeight = eval(pic).height + 9;
myWidth = eval(pic).width;
}
clearTimeout();
var height = screen.height;
var width = screen.width;
var leftpos = width / 2 - myWidth / 2;
var toppos = height / 2 - myHeight / 2;
self.moveTo(leftpos, toppos);
self.resizeTo(myWidth, myHeight);
document.il.src = 'loaded.gif';
}
else setTimeOut(resize(), 100);
}
<!-- STEP THREE: Paste this whole section into a new HTML document -->
<!-- STEP FOUR: Then save this new HTML document as: viewer.html -->
<html>
<head>
<script language="javascript" src="resizableViewer.js"></script>
</head>
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0" bgcolor="#FFFFFF">
<img border="0" src="loading.gif" width="100" height="9" name="il" onload="window.focus()">
<br>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
form = unescape(params["pic"]);
pic = new Image();
pic.src=form;
document.write("<img src=" + form + " boder=1 onload=resize()>");
// End -->
</script>
</body>
</html>
<!-- STEP FIVE: Save this code into the HEAD of your HTML page -->
<head>
<script language="javascript" src="resizableViewer.js"></script>
</head>
<!-- STEP SIX: Copy this code into the BODY of your HTML page -->
<body>
<center>
<a href="javascript:view('cotton.jpg')">Pic 1</a>
<a href="javascript:view('michael.jpg')">Pic 2</a>
</center>
</body>
<!-- STEP SEVEN: Save the image load images to your web server -->
<!-- ../img/resizable-viewer/loading.gif -->
<!-- ../img/resizable-viewer/loaded.gif -->
<p><center>
<font face="arial, helvetica" SIZE="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">JavaScript Source Code 3000</a></font>
</center><p>
<!-- Script Size: 2.56 KB -->
Wyszukiwarka
Podobne podstrony:
function cpdf set viewer preferencesTest Simple Viewerviewerhttps doc 0o 7g apps viewer googleusercontentfunction cpdf set viewer preferencesPhoto Gadget Viewer 1 2 infothumbnail viewerMars3D Viewer ReadmeFree DWG Viewer 10 1 0 238rec viewersource viewergallery viewerNovus PC Viewer 1 0więcej podobnych podstron