<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>1. Franz Xaver Uhl Classic</title> <style type="text/css"> <!-- html,body{height:100%} body {margin:0; padding:0; background:#333 url(sw_page_bg.png); overflow:hidden; font-family:Helvetica, Arial, sans-serif; font-size:16px;} /* custom fonts */ @font-face { font-family: 'eurof55-webfont'; src: url('fonts/eurof55-webfont.eot'); src: local(':&'), url('fonts/eurof55-webfont.woff') format('woff'), url('fonts/eurof55-webfont.ttf') format('truetype'), url('fonts/eurof55-webfont.svg#webfont8xigBfG2') format('svg'); } @font-face { font-family: 'eurof35-webfont'; src: url('fonts/eurof35-webfont.eot'); src: local(':&'), url('fonts/eurof35-webfont.woff') format('woff'), url('fonts/eurof35-webfont.ttf') format('truetype'), url('fonts/eurof35-webfont.svg#webfont8xigBfG2') format('svg'); } @font-face { font-family: 'graublauweb-webfont'; src: url('fonts/graublauweb-webfont.eot'); src: local(':&'), url('fonts/graublauweb-webfont.woff') format('woff'), url('fonts/graublauweb-webfont.ttf') format('truetype'), url('fonts/graublauweb-webfont.svg#webfont8xigBfG2') format('svg'); } .clear{clear:both;} a:link,a:visited,a:hover{color:#ddd;} a:hover{color:#fff; text-decoration:none;} #bg{position:fixed; left:585px; top:0; width:100%; height:100%;} #bgimg{display:none; cursor:pointer; -ms-interpolation-mode: bicubic;} /* special IE fix for resized images */ #preloader{position:absolute; z-index:2; width:140px; padding:20px; top:20px; left:50px; background:#000; color:#666; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; font-size:16px; -moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;} #preloader img{margin-right:20px;} #toolbar{display:inline-block; padding:4px 15px; margin:20px 15px; background:#262626 url(sw_btn_bg.png) repeat-x; -moz-border-radius:8px; -khtml-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; font-size:12px; color:#fff; cursor:pointer;} #outer_container{position:relative; margin:0; width:700px; padding:0 100px 0 0; z-index:2; background:url(empty.gif);} /* fucking IE needs a background value to understand hover area */ #customScrollBox{position:relative; overflow:hidden; background:url(sw_l_bg.png) repeat-y;} #customScrollBox .container{position:relative; width:585px; top:0; float:left;} #customScrollBox .content{clear:both;} #customScrollBox .content h1{padding:5px; margin:10px; color:#fff; font-family:eurof55-webfont, Helvetica, Arial, sans-serif; font-size:48px;} #customScrollBox .content h2{padding:5px; margin:10px 10px 0 10px; color:#fff; font-family:eurof35-webfont, Helvetica, Arial, sans-serif; font-size:24px;} #customScrollBox .content p{padding:5px; margin:0 10px 10px 10px; color:#ddd; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; line-height:26px;} .light{font-family:eurof35-webfont, Helvetica, Arial, sans-serif;} .grey{color:#999;} .lightgrey{color:#ddd;} .s36{font-size:36px;} .s24{font-size:24px;} #customScrollBox a.thumb_link{position:relative; margin:0 0 1px 1px; display:block; float:left;} #customScrollBox img{border:none;} #customScrollBox a.thumb_link .selected{position:absolute; top:0; left:0; width:145px; height:91px; background:url(sw_thumb_selected.png) no-repeat; display:none;} #dragger_container{position:relative; width:30px; height:580px; float:left; margin:10px 0 0 0; background:url(sw_dragger_bg.png) repeat-y center;} #dragger{position:absolute; width:30px; height:59px; background:url(round_custom_scrollbar_bg.png) no-repeat center center; cursor:pointer;} #arrow_indicator{position:absolute; z-index:1; width:50px; padding:10px; top:50%; margin-top:-25px; left:20px; background:url(sw_transparent_black_bg.png); -moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; display:none;} #nextimage_tip{position:fixed; z-index:1; padding:0 20px; line-height:40px; color:#fff; height:40px; top:50%; margin-top:-20px; right:20px; background:url(sw_transparent_black_bg.png); -moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; display:none; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif;} .with_border{border:1px solid #000;} .with_shadow{-moz-box-shadow:0 0 40px #000; -webkit-box-shadow:0 0 40px #000; box-shadow:0 0 40px #000;} --> </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script type="text/javascript" src="jquery.easing.1.3.js"></script> <script type="text/javascript" src="jquery.mousewheel.min.js"></script> </head> <body> <div id="outer_container"> <div id="customScrollBox"> <div class="container"> <div class="content"> <h1>1. Franz Xaver Uhl Classic <span class="lightgrey"> <br /> am 14. Juli 2012 </span> <br /><span class="light"><span class="grey"><span class="s36">Organisator: Hubert Kaes</span></span></span></h1> <div id="toolbar"></div><div class="clear"></div> <a href="imgs/PhotosvomStart/FXUC001.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC001_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC002.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC002_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC003.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC003_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC004.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC004_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC005.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC005_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC006.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC006_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC007.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC007_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC008.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC008_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC009.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC009_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC010.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC010_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC011.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC011_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC012.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC012_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC013.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC013_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC014.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC014_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC015.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC015_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC016.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC016_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC017.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC017_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC018.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC018_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC019.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC019_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC020.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC020_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC021.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC021_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC022.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC022_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC023.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC023_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC024.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC024_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC025.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC025_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC026.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC026_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC027.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC027_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC028.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC028_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC029.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC029_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC030.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC030_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC031.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC031_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC032.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC032_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC033.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC033_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC034.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC034_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC035.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC035_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC036.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC036_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC037.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC037_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC038.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC038_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC039.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC039_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC040.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC040_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC041.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC041_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC042.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC042_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC043.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC043_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC044.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC044_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC045.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC045_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC046.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC046_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC047.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC047_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC048.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC048_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC049.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC049_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC050.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC050_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC051.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC051_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC052.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC052_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC053.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC053_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC054.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC054_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC055.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC055_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC056.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC056_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC057.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC057_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC058.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC058_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC059.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC059_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC060.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC060_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC061.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC061_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC062.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC062_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC063.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC063_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC064.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC064_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC065.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC065_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC066.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC066_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC067.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC067_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC068.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC068_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC069.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC069_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC070.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC070_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC071.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC071_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC072.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC072_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC073.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC073_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC074.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC074_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC075.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC075_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC076.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC076_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC077.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC077_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC078.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC078_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC079.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC079_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC080.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC080_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC081.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC081_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC082.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC082_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC083.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC083_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC084.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC084_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC085.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC085_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC086.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC086_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC087.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC087_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC088.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC088_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC089.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC089_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC090.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC090_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC091.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC091_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC092.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC092_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC093.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC093_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC094.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC094_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC095.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC095_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC096.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC096_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC097.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC097_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC098.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC098_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC099.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC099_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC100.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC100_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC101.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC101_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC102.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC102_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC103.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC103_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC104.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC104_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC105.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC105_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <a href="imgs/PhotosvomStart/FXUC106.jpg" class="thumb_link"><span class="selected"></span><img src="imgs/PhotosvomStart/FXUC106_thumb.jpg" title="FXUC" alt="FXUC" class="thumb" /></a> <p class="clear"></p> </div> </div> <div id="dragger_container"><div id="dragger"></div></div> </div> </div> <div id="bg"> <img src="imgs/PhotosvomStart/FXUC001.jpg" title="FXUC" id="bgimg" /> <div id="preloader"><img src="ajax-loader_dark.gif" width="32" height="32" align="absmiddle" />LOADING...</div> <div id="arrow_indicator"><img src="sw_arrow_indicator.png" width="50" height="50" /></div> <div id="nextimage_tip">Nchstes Bild</div> </div> <script> //set default view mode $defaultViewMode="full"; //full (fullscreen background), fit (fit to window), original (no scale) //cache vars $bg=$("#bg"); $bgimg=$("#bg #bgimg"); $preloader=$("#preloader"); $outer_container=$("#outer_container"); $outer_container_a=$("#outer_container a.thumb_link"); $toolbar=$("#toolbar"); $nextimage_tip=$("#nextimage_tip"); $(window).load(function() { $toolbar.data("imageViewMode",$defaultViewMode); //default view mode ImageViewMode($toolbar.data("imageViewMode")); //cache vars $customScrollBox=$("#customScrollBox"); $customScrollBox_container=$("#customScrollBox .container"); $customScrollBox_content=$("#customScrollBox .content"); $dragger_container=$("#dragger_container"); $dragger=$("#dragger"); CustomScroller(); function CustomScroller(){ outerMargin=0; innerMargin=20; $customScrollBox.height($(window).height()-outerMargin); $dragger_container.height($(window).height()-innerMargin); visibleHeight=$(window).height()-outerMargin; if($customScrollBox_container.height()>visibleHeight){ //custom scroll depends on content height $dragger_container,$dragger.css("display","block"); totalContent=$customScrollBox_content.height(); draggerContainerHeight=$(window).height()-innerMargin; animSpeed=400; //animation speed easeType="easeOutCirc"; //easing type bottomSpace=1.05; //bottom scrolling space targY=0; draggerHeight=$dragger.height(); $dragger.draggable({ axis: "y", containment: "parent", drag: function(event, ui) { Scroll(); }, stop: function(event, ui) { DraggerOut(); } }); //scrollbar click $dragger_container.click(function(e) { var mouseCoord=(e.pageY - $(this).offset().top); var targetPos=mouseCoord+$dragger.height(); if(targetPos<draggerContainerHeight){ $dragger.css("top",mouseCoord); Scroll(); } else { $dragger.css("top",draggerContainerHeight-$dragger.height()); Scroll(); } }); //mousewheel $(function($) { $customScrollBox.bind("mousewheel", function(event, delta) { vel = Math.abs(delta*10); $dragger.css("top", $dragger.position().top-(delta*vel)); Scroll(); if($dragger.position().top<0){ $dragger.css("top", 0); $customScrollBox_container.stop(); Scroll(); } if($dragger.position().top>draggerContainerHeight-$dragger.height()){ $dragger.css("top", draggerContainerHeight-$dragger.height()); $customScrollBox_container.stop(); Scroll(); } return false; }); }); function Scroll(){ var scrollAmount=(totalContent-(visibleHeight/bottomSpace))/(draggerContainerHeight-draggerHeight); var draggerY=$dragger.position().top; targY=-draggerY*scrollAmount; var thePos=$customScrollBox_container.position().top-targY; $customScrollBox_container.stop().animate({top: "-="+thePos}, animSpeed, easeType); //with easing } //dragger hover $dragger.mouseup(function(){ DraggerOut(); }).mousedown(function(){ DraggerOver(); }); function DraggerOver(){ $dragger.css("background", "url(round_custom_scrollbar_bg_over.png)"); } function DraggerOut(){ $dragger.css("background", "url(round_custom_scrollbar_bg.png)"); } } else { //hide custom scrollbar if content is short $dragger,$dragger_container.css("display","none"); } } //resize browser window functions $(window).resize(function() { FullScreenBackground("#bgimg"); //scale bg image $dragger.css("top",0); //reset content scroll $customScrollBox_container.css("top",0); $customScrollBox.unbind("mousewheel"); CustomScroller(); }); LargeImageLoad($bgimg); }); //loading bg image $bgimg.load(function() { LargeImageLoad($(this)); }); function LargeImageLoad($this){ $preloader.fadeOut("fast"); //hide preloader $this.removeAttr("width").removeAttr("height").css({ width: "", height: "" }); //lose all previous dimensions in order to rescale new image data $bg.data("originalImageWidth",$this.width()).data("originalImageHeight",$this.height()); if($bg.data("newTitle")){ $this.attr("title",$bg.data("newTitle")); //set new image title attribute } FullScreenBackground($this); //scale new image $bg.data("nextImage",$($outer_container.data("selectedThumb")).next().attr("href")); //get and store next image if(typeof itemIndex!="undefined"){ if(itemIndex==lastItemIndex){ //check if it is the last image $bg.data("lastImageReached","Y"); $bg.data("nextImage",$outer_container_a.first().attr("href")); //get and store next image } else { $bg.data("lastImageReached","N"); } } else { $bg.data("lastImageReached","N"); } $this.fadeIn("slow"); //fadein background image if($bg.data("nextImage") || $bg.data("lastImageReached")=="Y"){ //don't close thumbs pane on 1st load SlidePanels("close"); //close the left pane } NextImageTip(); } //slide in/out left pane $outer_container.hover( function(){ //mouse over SlidePanels("open"); }, function(){ //mouse out SlidePanels("close"); } ); //Clicking on thumbnail changes the background image $outer_container_a.click(function(event){ event.preventDefault(); var $this=this; $bgimg.css("display","none"); $preloader.fadeIn("fast"); //show preloader //style clicked thumbnail $outer_container_a.each(function() { $(this).children(".selected").css("display","none"); }); $(this).children(".selected").css("display","block"); //get and store next image and selected thumb $outer_container.data("selectedThumb",$this); $bg.data("nextImage",$(this).next().attr("href")); $bg.data("newTitle",$(this).children("img").attr("title")); //get and store new image title attribute itemIndex=getIndex($this); //get clicked item index lastItemIndex=($outer_container_a.length)-1; //get last item index $bgimg.attr("src", "").attr("src", $this); //switch image }); //clicking on large image loads the next one $bgimg.click(function(event){ var $this=$(this); if($bg.data("nextImage")){ //if next image data is stored $this.css("display","none"); $preloader.fadeIn("fast"); //show preloader $($outer_container.data("selectedThumb")).children(".selected").css("display","none"); //deselect thumb if($bg.data("lastImageReached")!="Y"){ $($outer_container.data("selectedThumb")).next().children(".selected").css("display","block"); //select new thumb } else { $outer_container_a.first().children(".selected").css("display","block"); //select new thumb - first } //store new selected thumb var selThumb=$outer_container.data("selectedThumb"); if($bg.data("lastImageReached")!="Y"){ $outer_container.data("selectedThumb",$(selThumb).next()); } else { $outer_container.data("selectedThumb",$outer_container_a.first()); } $bg.data("newTitle",$($outer_container.data("selectedThumb")).children("img").attr("title")); //get and store new image title attribute if($bg.data("lastImageReached")!="Y"){ itemIndex++; } else { itemIndex=0; } $this.attr("src", "").attr("src", $bg.data("nextImage")); //switch image } }); //function to get element index (fuck you IE!) function getIndex(theItem){ for ( var i = 0, length = $outer_container_a.length; i < length; i++ ) { if ( $outer_container_a[i] === theItem ) { return i; } } } //toolbar (image view mode button) hover $toolbar.hover( function(){ //mouse over $(this).stop().fadeTo("fast",1); }, function(){ //mouse out $(this).stop().fadeTo("fast",0.8); } ); $toolbar.stop().fadeTo("fast",0.8); //set its original state //Clicking on toolbar changes the image view mode $toolbar.click(function(event){ if($toolbar.data("imageViewMode")=="full"){ ImageViewMode("fit"); } else if($toolbar.data("imageViewMode")=="fit") { ImageViewMode("original"); } else if($toolbar.data("imageViewMode")=="original"){ ImageViewMode("full"); } }); //next image balloon tip function NextImageTip(){ if($bg.data("nextImage")){ //check if this is the first image $nextimage_tip.stop().css("right",20).fadeIn("fast").fadeOut(2000000000000000000000000000000000000000000000,"easeInExpo",function(){$nextimage_tip.css("right",$(window).width());}); } } //slide in/out left pane function function SlidePanels(action){ var speed=900; var easing="easeInOutExpo"; if(action=="open"){ $("#arrow_indicator").fadeTo("fast",0); $outer_container.stop().animate({left: 0}, speed,easing); $bg.stop().animate({left: 585}, speed,easing); } else { $outer_container.stop().animate({left: -710}, speed,easing); $bg.stop().animate({left: 0}, speed,easing,function(){$("#arrow_indicator").fadeTo("fast",1);}); } } //Image scale function function FullScreenBackground(theItem){ var winWidth=$(window).width(); var winHeight=$(window).height(); var imageWidth=$(theItem).width(); var imageHeight=$(theItem).height(); if($toolbar.data("imageViewMode")!="original"){ //scale $(theItem).removeClass("with_border").removeClass("with_shadow"); //remove extra styles of orininal view mode var picHeight = imageHeight / imageWidth; var picWidth = imageWidth / imageHeight; if($toolbar.data("imageViewMode")!="fit"){ //image view mode: full if ((winHeight / winWidth) < picHeight) { $(theItem).css("width",winWidth).css("height",picHeight*winWidth); } else { $(theItem).css("height",winHeight).css("width",picWidth*winHeight); }; } else { //image view mode: fit if ((winHeight / winWidth) > picHeight) { $(theItem).css("width",winWidth).css("height",picHeight*winWidth); } else { $(theItem).css("height",winHeight).css("width",picWidth*winHeight); }; } //center it $(theItem).css("margin-left",((winWidth - $(theItem).width())/2)).css("margin-top",((winHeight - $(theItem).height())/2)); } else { //no scale //add extra styles for orininal view mode $(theItem).addClass("with_border").addClass("with_shadow"); //set original dimensions $(theItem).css("width",$bg.data("originalImageWidth")).css("height",$bg.data("originalImageHeight")); //center it $(theItem).css("margin-left",((winWidth-$(theItem).outerWidth())/2)).css("margin-top",((winHeight-$(theItem).outerHeight())/2)); } } //image view mode function - full or fit function ImageViewMode(theMode){ $toolbar.data("imageViewMode", theMode); //store new mode FullScreenBackground($bgimg); //scale bg image //re-style button if(theMode=="full"){ $toolbar.html("<span class='lightgrey'>IMAGE VIEW MODE &rsaquo;</span> FULL"); } else if(theMode=="fit") { $toolbar.html("<span class='lightgrey'>IMAGE VIEW MODE &rsaquo;</span> FIT"); } else { $toolbar.html("<span class='lightgrey'>IMAGE VIEW MODE &rsaquo;</span> ORIGINAL"); } } //preload script images var images=["ajax-loader_dark.gif","round_custom_scrollbar_bg_over.png"]; $.each(images, function(i) { images[i] = new Image(); images[i].src = this; }); </script> </body> </html>