03. september 2003 - 10:08
Der er
1 kommentar og
1 løsning
esc-knap, bruges til at gå "tilbage"
Jeg har en side der viser billeder i fuldskærm. Nu vil jeg gerne have at siden lukkes ned og går "tilbage" til den forrige side når man trykker på esc-knappen.
scriptet ser sådan her ud :
var alttext = "$label".replace(/\'/g, "'");
alttext = "'Click to start Slide Show from " + '"' + alttext + '"' + "'";
var imagefilepath = "<%=ifpath%>".replace(/\'/g, "%27");
var htmltext = '<A HREF="' + "<%=ifpath%>" + '" onclick="closeup(' + "'" + imagefilepath + "'" + ');return false" TITLE=' + alttext + '>';
htmltext += '<IMG CLASS="image" SRC="' + "$thumbPath" + '" WIDTH="$thumbWidth" HEIGHT="$thumbHeight" BORDER=0 Alt='
htmltext += alttext + ' TITLE=' + alttext + '></A>'
document.write(htmltext);
håber nogen kan hjælpe.
tak
Daniel
03. september 2003 - 10:10
#1
det var det forkerte script her er det rigtige : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD><META http-equiv="Page-Enter" CONTENT="progid:DXImageTransform.Microsoft.Fade(Duration=2)" />
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
<TITLE>$label</TITLE>
<LINK HREF="../$styleFile" REL=stylesheet>
<script language="JavaScript" type="text/javascript">
<!--<ja:if exists="nextPage">
var nextURL = "$nextPage";</ja:if><ja:else>
var nextURL = "$firstPage";</ja:else><ja:if exists="previousPage">
var prevURL = "$previousPage";</ja:if><ja:else>
var prevURL = "$lastPage";</ja:else>
var firstURL = "$firstPage";
var lastURL = "$lastPage";
var timeout = 0;
var play_img = new Image();
play_img.src = "../gifs/play.gif";
var pause_img = new Image();
pause_img.src = "../gifs/pause.gif";
var delay = 5000;
var fullscreen = false;
if (window.opener && window.opener.document.forms.settings) {
form = window.opener.document.forms.settings;
delay = form.delay.value*1000;
fullscreen = form.fullscreen.checked;
} else {
var url = document.parentWindow.location.href;
if (url.indexOf("?") > 0) {
url = url.substr(url.indexOf("?") + 1);
nextURL += "?" + url;
prevURL += "?" + url;
firstURL += "?" + url;
lastURL += "?" + url;
url += "&";
if (url.indexOf("delay=") >= 0) {
var param = url.substr(url.indexOf("delay=") + 6);
param = param.substr(0, param.indexOf("&"));
delay = parseInt(param, 10) * 1000;
}
if (url.indexOf("fullscreen=") >= 0) {
var param = url.substr(url.indexOf("fullscreen=") + 11);
param = param.substr(0, param.indexOf("&"));
fullscreen = (param.toUpperCase() == "YES");
}
}
}
function slide() {
if (delay) {
timeout = setTimeout(nextpage, delay);
}
}
function nextpage() {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
}
document.location.href = nextURL;
}
function prevpage() {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
}
document.location.href = prevURL;
}
function firstpage() {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
}
document.location.href = firstURL;
}
function lastpage() {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
}
document.location.href = lastURL;
}
function playpause() {
if (delay) {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
document.images['playpause'].src = play_img.src;
} else {
document.images['playpause'].src = pause_img.src;
nextpage();
}
} else {
nextpage();
}
}
function showindex() {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
}
if (window.opener) {
window.close();
} else {
<%
String ifpath = "../" + indexPage;
if (ifpath.indexOf("x.html") >= 0) ifpath = ifpath.substring(0, ifpath.indexOf("x.html")) + "x-frame.html";
%>
document.parentWindow.location.href = "<%=ifpath%>";
}
}
var avail;
function setVal() {
// colCount = 5;
// rowCount = 4;
var win = new Array ("w","h");
avail = new Array ("w","h");
var obso = new Array ("w","h");
// var imgSp = new Array ("w","h");
var headSp = 65; // Space for the title and the controls, dependant on stylesheet
var lablSp = 0; // Rowheight for the labels, dependant on stylesheet
var footSp = 0; // Space for the jAlbum link and bottom margin
var ixMarg = 10; // left and right margin value
var scrollSp = 16; // width or height of scrollbars - shouldn't really be needed addSpH = 40; // Additional vertical space needed, probably due too browser dependent rendering
var addSpH = 0; // Additional vertical space needed, probably due to browser dependent rendering
var addSpW = 0; // Additional horizontal space needed, probably due to browser dependent rendering
if (window.innerWidth) {
win["w"] = window.innerWidth;
win["h"] = window.innerHeight;
} else if (document.body.clientWidth) {
win["w"] = document.body.clientWidth;
win["h"] = document.body.clientHeight;
} else {
win["w"] = screen.width;
win["h"] = screen.height;
}
obso["w"] = (ixMarg * 2) + scrollSp + addSpW;
obso["h"] = headSp + lablSp + footSp + scrollSp + addSpH;
avail["w"] = win["w"] - obso["w"];
avail["h"] = win["h"] - obso["h"];
}
var tWidth = 0;
var tHeight = 0;
function sizeImg(imgW, imgH)
{
var imgRatio = imgW / imgH;
function scaleWB() { tWidth = avail["w"]; tHeight = tWidth / imgRatio; }
function scaleBW() { tHeight = avail["h"]; tWidth = tHeight * imgRatio; }
if (imgRatio >= 1) // determination of oriontation of image
{
scaleWB();
if (tHeight > avail["h"]) { scaleBW(); }
}
else
{
scaleBW();
if (tWidth > avail["w"]) { scaleWB(); }
}
}
var btWidth = 0;
var btHeight = 0;
var imgbRatio = 1;
function sizeButtons(imgW, imgH)
{
setVal();
btWidth = imgW;
btHeight = imgH;
if (avail["w"] < 1200) {
imgbRatio = avail["w"] / 1200;
btWidth = Math.round(btWidth * imgbRatio);
btHeight = Math.round(btHeight * imgbRatio);
}
}
var takenAction = false;
function doKeyPress() {
var oEvent = document.parentWindow.event;
var myKeyCode = oEvent.keyCode;
if (oEvent.repeat || takenAction) {
return;
}
if (myKeyCode >= 16 && myKeyCode <= 18) {
return;
}
if (oEvent.shiftKey) {
myKeyCode += 1000;
}
if (oEvent.ctrlKey) {
myKeyCode += 2000;
}
if (oEvent.altKey) {
myKeyCode += 4000;
}
// alert(oEvent.type + "=" + myKeyCode);
switch (myKeyCode) {
case 13: // enter
case 9: // tab
case 39: // right arrow
case 40: // down arrow
case 34: // page down
case 107: // NumberPage +
case 187: // keyboard +
case 1187: // keyboard shift +
takenAction = true;
nextpage();
break;
case 8: // backspace
case 1009: // shift tab
case 37: // left arrow
case 38: // up arrow
case 33: // page up
case 109: // NumberPage -
case 189: // keyboard -
case 1189: // keyboard shift -
takenAction = true;
prevpage();
break;
case 32: // space bar
playpause();
break;
case 36: // Home
takenAction = true;
firstpage();
break;
case 35: // End
takenAction = true;
lastpage();
break;
case 27: // Escape
takenAction = true;
oEvent.returnValue = false;
showindex();
break;
case 45: // Insert
break;
case 46: // Delete
takenAction = true;
showindex();
break;
default:
// alert(oEvent.type + "=" + myKeyCode);
break;
}
}
var showing = false;
function toggleInfo() {
if (showing == false) {
if (timeout) {
clearTimeout(timeout);
timeout = 0;
document.images['playpause'].src = play_img.src;
}
if (document.all || document.getElementById) {
document.getElementById('imageinfo').style.visibility = "visible"; // IE & Gecko
} else {
document.layers['imageinfo'].visibility = "show"; // Netscape 4
}
showing = true;
} else {
if (document.all || document.getElementById) {
document.getElementById('imageinfo').style.visibility = "hidden"; // IE & Gecko
} else {
document.layers['imageinfo'].visibility = "hide"; // Netscape 4
}
showing = false;
}
}
function MM_reloadPage(init) {
//reloads the window if Nav4 resized
if (init==true) with (navigator) {
if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW = innerWidth;
document.MM_pgH = innerHeight;
onresize = MM_reloadPage;
}
} else if (innerWidth != document.MM_pgW || innerHeight != document.MM_pgH) {
location.reload();
}
}
MM_reloadPage(true);
window.focus();
// -->
</script>
</HEAD>
<BODY ID="slide" onload="slide()" marginwidth="0" marginheight="0" onkeydown="doKeyPress()" background="../gifs/bakgrund.jpg">
<div CLASS="imageinfo" ID="imageinfo" style="position:absolute; left:98px; top:123px; z-index:1; background-color: #000000; layer-background-color: #000000; width: 385px; height: 20px; visibility: hidden; border: 1px none #000000; background-image: url(../gifs/bakgrund.jpg); layer-background-image: url(../gifs/bakgrund.jpg)">
<table width="100%" border="3" cellpadding="2" cellspacing="0" style="border-style:window-inset" onclick="toggleInfo()">
<tr>
<td>
<table width="100%" border="0" cellpadding="1" cellspacing="1">
<tr class="rowFirst">
<td nowrap valign="top">Picture</td>
<td nowrap valign="top"><b>$label</b></td>
</tr>
<tr class="rowSecond">
<td nowrap valign="top">Format</td>
<td nowrap valign="top"><ja:if exists=formatName>$formatName</ja:if><!--<ja:if exists=compressionLevel> ($compressionLevel)</ja:if>--></td>
</tr>
<tr class="rowFirst">
<td nowrap valign="top">File size</td>
<td nowrap valign="top"><%=(float)((int)(fileSize/10000))/100;%>Mbytes</td>
</tr>
<tr class="rowSecond">
<td nowrap valign="top">Original date</td>
<td nowrap valign="top">$originalDate</td>
</tr>
<tr class="rowFirst">
<td nowrap valign="top">Resolution</td>
<td nowrap valign="top">$resolution</td>
</tr>
<tr class="rowSecond">
<td nowrap valign="top">Size @ 300dpi</td>
<td nowrap valign="top"><%=(int)(originalWidth/11.8);%>mm x <%=(int)(originalHeight/11.8);%>mm
<br>
<%=(float)((int)(originalWidth/3))/100;%>" x <%=(float)((int)(originalHeight/3))/100;%>"
<!--( Formateringstest:
<%=
import java.text.*;
NumberFormat fmt = NumberFormat.getInstance();
fmt.format(originalWidth/11.8);
%>
)-->
</td>
</tr>
<tr class="rowFirst">
<td nowrap valign="top">Artist</td>
<td nowrap valign="top"><ja:if exists="meta"><%= meta.get("Artist") %></ja:if><ja:else> </ja:else></td>
</tr>
<tr class="rowSecond">
<td nowrap valign="top">Photographer</td>
<td nowrap valign="top"><ja:if exists="meta"><%= meta.get("Copyright") %></ja:if><ja:else> </ja:else></td>
</tr>
<tr class="rowFirst">
<td nowrap valign="top">Film Scanner make</td>
<td nowrap valign="top">$cameraMake</td>
</tr>
<tr class="rowSecond">
<td nowrap valign="top">Scanner model</td>
<td nowrap valign="top">$cameraModel</td>
</tr>
<tr class="rowFirst">
<td nowrap valign="top">Firmware Version</td>
<td nowrap valign="top"><ja:if exists="meta"><%= meta.get("Software") %></ja:if><ja:else> </ja:else></td>
</tr>
<ja:if exists=originalPath>
<tr class="rowSecond">
<td nowrap valign="top">Download Original Image</td>
<td nowrap valign="middle" align="center"><a href="$originalPath" target="_blank" title="To download the picture. Right click and choose "Save Target As...""><img src="../gifs/download.gif" border="0"></a></td>
</tr>
</ja:if>
</table>
</td>
</tr>
</table>
</div>
<!-- Previous, play/pause and close buttons -->
<!-- div id="navigation" -->
<table cellpadding=0 cellspacing=0 border=0 align="center" width="90%">
<tr>
<td align="left">
<ja:if exists="cameraMake">
<A HREF="java script:toggleInfo()" ALT="Photographic information"><script language="JavaScript" type="text/javascript">
sizeButtons(142, 61);
document.write('<IMG SRC="../gifs/camera3.gif" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="Photographic information">');
</script></A></ja:if><ja:else> </ja:else>
</td>
<td align="center"><script language="JavaScript" type="text/javascript">
var htmltext = " ";
if (!delay) {
htmltext = "$label".substr(0, 4);
htmltext += " - slide $imageNum of $totalImages";
}
document.write(htmltext);
</script></td>
<td align="right">
<table border=0>
<tr>
<td>
<!-- Previous button -->
<a href="java script:prevpage()" ALT="Previous page"><script language="JavaScript" type="text/javascript">
document.write('<IMG SRC="../gifs/previous.gif" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="Previous page">');
</script></A>
</td>
<td>
<!-- Play/Pause button -->
<a href="java script:playpause()"><script language="JavaScript" type="text/javascript">
if (delay) {
var nextimg = "../gifs/pause.gif";
var nexttxt = "Toggle Slideshow";
} else {
var nextimg = "../gifs/next.gif";
var nexttxt = "Next Slide";
}
document.write('<IMG SRC="' + nextimg + '" name="playpause" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="' + nexttxt + '">');
</script></A>
</td>
<td>
<!-- Close button -->
<a href="java script:showindex()"><script language="JavaScript" type="text/javascript">
document.write('<IMG SRC="../gifs/index.gif" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="Return to Index">');
</script></A>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- /div -->
<!-- Image with link to next OR original path -->
<table align="center" cellspacing=0 cellpadding=0 border=0 width="98%">
<tr>
<td align="center" valign="top" style="vertical-align:top">
<ja:if exists=originalPath>
<A HREF="$originalPath"><script type="text/javascript">
setVal();
sizeImg($imageWidth, $imageHeight);
document.write('<IMG SRC="' + "$imagePath" + '" WIDTH="' + tWidth + '" HEIGHT="' + tHeight + '" BORDER=0 ALT="Click to view Original Image">');
</script></a>
</ja:if><ja:else>
<A HREF="java script:nextpage()"><script type="text/javascript">
setVal();
sizeImg($imageWidth, $imageHeight);
document.write('<IMG SRC="' + "$imagePath" + '" WIDTH="' + tWidth + '" HEIGHT="' + tHeight + '" BORDER=0 ALT="Click to show Next Page">');
</script></a>
</ja:else>
</td>
</tr>
</table>
<!-- Always display comment over image (if exists) -->
<ja:if exists="comment">
<div id="comment_shadow">$comment</div>
<div id="comment">$comment</div>
</ja:if>
</BODY>
</HTML>