|
|
Line 99: |
Line 99: |
| </head> | | </head> |
| <body> | | <body> |
- | <div class="navleftholder">
| |
| <ul class="navleft"> | | <ul class="navleft"> |
| <li><a id="navleftsub1" class="navleftsub" href="#apr">April</a></li> | | <li><a id="navleftsub1" class="navleftsub" href="#apr">April</a></li> |
Line 106: |
Line 105: |
| <li><a id="navleftsub4" class="navleftsub" href="#aug">August</a></li> | | <li><a id="navleftsub4" class="navleftsub" href="#aug">August</a></li> |
| <li><a id="navleftsub5" class="navleftsub" href="#sept">September</a></li> | | <li><a id="navleftsub5" class="navleftsub" href="#sept">September</a></li> |
- | </ul></div> | + | </ul> |
- | <script type="text/javascript">
| + | |
- | $(function(){
| + | |
- | var apr_top = $("#apr").offset().top;
| + | |
- | var mayjun_top = $("#mayjun").offset().top;
| + | |
- | var jul_top = $("#jul").offset().top;
| + | |
- | var aug_top = $("#aug").offset().top;
| + | |
- | var sept_top = $("#sept").offset().top;
| + | |
- | //alert(tops);
| + | |
- | $(window).scroll(function(){
| + | |
- | var scroH = $(this).scrollTop();
| + | |
- | var screenH = window.innerHeight * 0.5;
| + | |
- | if(scroH>=sept_top- screenH){
| + | |
- | set_cur("#navleftsub5");
| + | |
- | }else if(scroH>=aug_top- screenH){
| + | |
- | set_cur("#navleftsub4");
| + | |
- | }else if(scroH>=jul_top- screenH){
| + | |
- | set_cur("#navleftsub3");
| + | |
- | }else if(scroH>=mayjun_top- screenH){
| + | |
- | set_cur("#navleftsub2");
| + | |
- | }else if(scroH>=apr_top- screenH){
| + | |
- | set_cur("#navleftsub1");
| + | |
- | }
| + | |
- | });
| + | |
- |
| + | |
- | $(".navleft li a").click(function() {
| + | |
- | var el = $(this).attr('class');
| + | |
- | $('html, body').animate({
| + | |
- | scrollTop: $("#"+el).offset().top
| + | |
- | }, 300);
| + | |
- | $(this).addClass("cur").parent().siblings().find("a").removeClass("cur");
| + | |
- | });
| + | |
- |
| + | |
- | });
| + | |
- | function set_cur(n){
| + | |
- | if($(".navleft a").hasClass("cur")){
| + | |
- | $(".navleft a").removeClass("cur");
| + | |
- | }
| + | |
- | $(".navleft a"+n).addClass("cur");
| + | |
- | }
| + | |
- | </script>
| + | |
- | <script type="text/javascript">
| + | |
- | $(function(){
| + | |
- | $('#myGallery1').galleryView({
| + | |
- | panel_width: 480,
| + | |
- | panel_height: 256,
| + | |
- | autoplay: true,
| + | |
- | show_infobar: true,
| + | |
- | infobar_opacity: 0.8,
| + | |
- | pause_on_hover: true,
| + | |
- | enable_overlays: true,
| + | |
- | panel_scale: 'crop',
| + | |
- | show_captions: true,
| + | |
- | easing: 'swing',
| + | |
- | pan_images: true,
| + | |
- | });
| + | |
- | $('#myGallery2').galleryView({
| + | |
- | panel_width: 480,
| + | |
- | panel_height: 256,
| + | |
- | autoplay: true,
| + | |
- | show_infobar: true,
| + | |
- | infobar_opacity: 0.8,
| + | |
- | pause_on_hover: true,
| + | |
- | enable_overlays: true,
| + | |
- | panel_scale: 'crop',
| + | |
- | show_captions: true,
| + | |
- | easing: 'swing',
| + | |
- | pan_images: true,
| + | |
- | });
| + | |
- | $('#myGallery3').galleryView({
| + | |
- | panel_width: 480,
| + | |
- | panel_height: 256,
| + | |
- | autoplay: true,
| + | |
- | show_infobar: true,
| + | |
- | infobar_opacity: 0.8,
| + | |
- | pause_on_hover: true,
| + | |
- | enable_overlays: true,
| + | |
- | panel_scale: 'crop',
| + | |
- | show_captions: true,
| + | |
- | easing: 'swing',
| + | |
- | pan_images: true,
| + | |
- | });
| + | |
- | $('#myGallery4').galleryView({
| + | |
- | panel_width: 480,
| + | |
- | panel_height: 256,
| + | |
- | autoplay: true,
| + | |
- | show_infobar: true,
| + | |
- | infobar_opacity: 0.8,
| + | |
- | pause_on_hover: true,
| + | |
- | enable_overlays: true,
| + | |
- | panel_scale: 'crop',
| + | |
- | show_captions: true,
| + | |
- | easing: 'swing',
| + | |
- | pan_images: true,
| + | |
- | });
| + | |
- | $('#myGallery5').galleryView({
| + | |
- | panel_width: 480,
| + | |
- | panel_height: 256,
| + | |
- | autoplay: true,
| + | |
- | show_infobar: true,
| + | |
- | infobar_opacity: 0.8,
| + | |
- | pause_on_hover: true,
| + | |
- | enable_overlays: true,
| + | |
- | panel_scale: 'crop',
| + | |
- | show_captions: true,
| + | |
- | easing: 'swing',
| + | |
- | pan_images: true,
| + | |
- | });
| + | |
- | });
| + | |
- | </script>
| + | |
| </body> | | </body> |
| </html> | | </html> |