JSBrowser.html / JSBrowser-dev.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<style type="text/css">
	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td {
	    margin: 0;
	    padding: 0;
	    border: 0;
	    outline: 0;
	    font-size: 100%;
	    vertical-align: baseline;
	    background: transparent;
	}
	body {
	    line-height: 1;
		text-align: center;
	}
	ol, ul {
	    list-style: none;
	}
	blockquote, q {
	    quotes: none;
	}
	blockquote:before, blockquote:after,
	q:before, q:after {
	    content: '';
	    content: none;
	}
	
	/* remember to define focus styles! */
	:focus {
	    outline: 0;
	}
	
	/* remember to highlight inserts somehow! */
	ins {
	    text-decoration: none;
	}
	del {
	    text-decoration: line-through;
	}
	
	/* tables still need 'cellspacing="0"' in the markup */
	table {
	    border-collapse: collapse;
	    border-spacing: 0;
	}	
	







	
	#container, body {
		background: black;
	}
	
	
	
	
	a, a:visited, a:active {
		color: black;
		text-decoration: none;
		background-color: transparent;
	}
	a:hover {
		background-color: silver;
	}
	
	
	
	
	
	
	#container {
		position:absolute; 
		width: 100%;
		height: 100%;
		cursor: pointer;
		z-index: -1;
		
	}
    
	.template {
	/*	display: none;*/
	}	
	
    #tip {
    	position: absolute;
		top: 500px;
		left: 200px;
		background-color: white;
		padding: 0.5em;
		display: none;
		
    }	
	
	body {
		overflow: hidden;
	}
	
	
	#information, #tip {
		font-family: monospace, sans-serif;
		font-size: 80%;
		opacity:0.6;
		filter:alpha(opacity=60);
		
        -moz-border-radius: 12px; /* FF1+ */
        -webkit-border-radius: 12px; /* Saf3-4 */
        border-radius: 12px; /* Opera 10.5, IE 9, Saf5, Chrome */       		
		
	}
	

	#currentImg {
		font-weight: bold;
		margin-bottom: 1em;
	}

    .activeLink {
    	font-weight: bold;
    }

    .imageLink {
    	font-size: 90%;
    }
	
	
	.list {
		display: none;
		margin-bottom: 1em;
		
	}
	#currentImg, .list * {
        width: 10em;
        overflow: hidden;
        text-overflow: ellipsis;    
        white-space: nowrap;
		
	}
	
	
    #information {
    	position: absolute;
		left: 1em;
		top: 1em;
		background-color: white;
		padding: 1em;
		text-align: left;

    }	
	
	/*
    #information:hover {
        opacity:1;
        filter:alpha(opacity=100);
    }
    */
	#imgList  {
		
		
	}
	#showAll {
		
	}
	img {
		-moz-box-shadow: 0px 0px 15px #ffffff; /* FF3.5+ */
		-webkit-box-shadow: 0px 0px 15px #ffffff; /* Saf3.0+, Chrome */
		box-shadow: 0px 0px 15px #ffffff; /* Opera 10.5, IE 9.0 */
	}
	
	#projecthome {
		font-size: 100%;
		margin-top: 1em;
	}
	
	h1{
		font-size: 100%;
	}
	
	#listCloseButton {
		margin-left: 4.5em;
		font-weight: bold;
		font-size: 110%;
	}
	
</style>

<!-- Url parsing library -->
<script type="text/javascript" src="js/vendor/parseuri.js"></script>

<!-- Functional and string manipulation tools for Javascript -->
<script type="text/javascript" src="js/vendor/underscore.js"></script>
<script type="text/javascript" src="js/vendor/underscore.strings.js"></script>

<!-- jQuery and its plugings -->
<script type="text/javascript" src="js/vendor/jquery.js"></script>
<script type="text/javascript" src="js/vendor/jquery.ba-hashchange.js"></script>
<script type="text/javascript" src="js/vendor/jQueryRotate.js"></script>
<script type="text/javascript" src="js/vendor/jquery.transform-0.8.0.min.js"></script>
<script type="text/javascript" src="js/vendor/jquery.query-2.1.7.js"></script>

<!-- My code -->
<script type="text/javascript" src="js/jquery.hashmanager.js"></script>
<script type="text/javascript" src="js/jquery.imgpreload.js"></script>
<script type="text/javascript" src="js/jquery.maximizeto.js"></script>
<script type="text/javascript" src="js/jquery.hidewhennomovement.js"></script>
<script type="text/javascript" src="js/jquery.cursortip.js"></script>
<script type="text/javascript" src="js/jquery.jsview.js"></script>
<script type="text/javascript" src="js/jquery.jsview.main.js"></script>

<title>loading - JSBrowser.html</title>
</head>
<body>
<div class="template" id="tip"></div>

<div id="information">

    <p>
	   <span id="currentImgIndex">0</span> / <span id="imgCount">0</span>
	</p>
	
	
	<p id="currentImg">
		<a href="" title="Open the current image directly in the browser"></a>
	</p>
	
	
	<div id="imgList" class="list" >
	    <div>
		  <h1>IMAGES <a href=""  id="listCloseButton">X</a></h1>
		</div>
	</div>
	
	<div id="subdirList" class="list">
		<h1>OTHER PAGES</h1>
	</div>
	
	<p><a href="" id="showAll" 
	      title="Show list of images" >show list</a></p>
	
	<p id="projecthome">
		<a href="http://esa-matti.suuronen.org/projects/jsbrowser.html/"
		   title="Goto JSBrowser.html homepage"
		>JSBrowser.html</a>
	</p>
	
</div>
<div id="container">
</div>
</body>
</html>
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.