Difference between revisions of "Team:CHINA CD UESTC/memberDemo"

Revision as of 11:07, 15 April 2015

<!DOCTYPE html>

测试！！

@@ Line 3: / Line 3: @@
 <html lang="en" class="js flexbox canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths wf-brandongrotesque-i4-active wf-brandongrotesque-i7-active wf-brandongrotesque-n4-active wf-brandongrotesque-n7-active wf-dincondensedweb-n4-active wf-freightbigpro-i4-active wf-freightbigpro-i7-active wf-freightbigpro-n4-active wf-freightbigpro-n7-active wf-active"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-     <!-- CSS 	-->
+     <!-- CSS
-    <link rel="stylesheet" type="text/css" href="./jquery.fancybox.css">
      <link rel="stylesheet" type="text/css" href="./css/sidemenu.css">
      <link rel="stylesheet" type="text/css" href="./css/teamcontent.css" >
+    -->
 </head>
 <style type="text/css">
@@ Line 125: / Line 125: @@
 body.opened aside #mobileMenuButton span:first-child {  opacity: 1;  filter: alpha(opacity=100);  -webkit-transform: translate(0px,7px) rotate(45deg);  -moz-transform: translate(0px,7px) rotate(45deg);  -ms-transform: translate(0px,7px) rotate(45deg);  -o-transform: translate(0px,7px) rotate(45deg);  transform: translate(0px,7px) rotate(45deg);}
 body.opened aside #mobileMenuButton span:last-child {  opacity: 1;  filter: alpha(opacity=100);  -webkit-transform: translate(0px,-7px) rotate(-45deg);  -moz-transform: translate(0px,-7px) rotate(-45deg);  -ms-transform: translate(0px,-7px) rotate(-45deg);  -o-transform: translate(0px,-7px) rotate(-45deg);  transform: translate(0px,-7px) rotate(-45deg);}
-body.opened #content {  left: 100px;  opacity: 0.2 !important;  pointer-events: none;}
+body.opened #realcontent {  left: 100px;  opacity: 0.2 !important;  pointer-events: none;}
 * {  margin: 0;  padding: 0;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}
@@ Line 134: / Line 134: @@
 img {  -moz-user-select: none;  -webkit-user-select: none;  -ms-user-select: none;  user-select: none;  -webkit-user-drag: none;  user-drag: none;}
 html,body {  min-height: 100%;  width: 100%;  height: 100%;  background: #000000 ; color: #ffffff;  overflow: hidden;  font-family: 'din-condensed-web';  font-size: 14px;  font-weight: 400;}
-#content {  position: absolute;  left: 260px;  top: 0;  right: 0;  height: 100%;  overflow-y: scroll;  -webkit-transition: all 200ms ease-out;  -moz-transition: all 200ms ease-out;  -ms-transition: all 200ms ease-out;  -o-transition: all 200ms ease-out;  transition: all 200ms ease-out;  -webkit-transform: translate3d(0,0,0);  -moz-transform: translate3d(0,0,0);  -ms-transform: translate3d(0,0,0);  -o-transform: translate3d(0,0,0);  transform: translate3d(0,0,0);}
+#realcontent {  position: absolute;  left: 260px;  top: 0;  right: 0;  height: 100%;  overflow-y: scroll;  -webkit-transition: all 200ms ease-out;  -moz-transition: all 200ms ease-out;  -ms-transition: all 200ms ease-out;  -o-transition: all 200ms ease-out;  transition: all 200ms ease-out;  -webkit-transform: translate3d(0,0,0);  -moz-transform: translate3d(0,0,0);  -ms-transform: translate3d(0,0,0);  -o-transform: translate3d(0,0,0);  transform: translate3d(0,0,0);}
 .owl-wrapper-outer,.owl-wrapper,.owl-item {  height: 100%;}
 .fullBg {  position: absolute;  top: 0;  left: 0;  display: none;}
@@ Line 156: / Line 156: @@
 @media screen and (max-width: 1050px) {  html aside {    width: 200px;  }
    html aside #logo {    margin-left: 20px;    margin-right: 20px;  }
-   html #content {    left: 200px;  }
+   html #realcontent {    left: 200px;  }
 }
 @media screen and (max-width: 700px) {  html #awwwards {    display: none;  }
    html aside {    left: -200px;  }
    html aside #mobileMenuButton {    display: block;  }
-   html #content {    left: 0;    right: auto;    width: 100%;  }
+   html #realcontent {    left: 0;    right: auto;    width: 100%;  }
+}
+#homeIndexBody {
+	float:right;
 }
      </style>
-<body id="homeIndexBody">
+<div id="homeIndexBody">
      <aside>
@@ Line 244: / Line 248: @@
-     <div id="content">
+     <div id="realcontent">
      <p >测试！！</p><br>
@@ Line 300: / Line 304: @@
          var experienceInterval;
          function experienceGalleryNext() {
-             var $active = $('#content #homeIndex a.experience .gallery img.active');
+             var $active = $('#realcontent #homeIndex a.experience .gallery img.active');
-             if ( $active.length == 0 ) $active = $('#content #homeIndex a.experience .gallery img:last');
+             if ( $active.length == 0 ) $active = $('#realcontent #homeIndex a.experience .gallery img:last');
-             var $next =  $active.next().length ? $active.next() : $('#content #homeIndex a.experience .gallery img:first');
+             var $next =  $active.next().length ? $active.next() : $('#realcontent #homeIndex a.experience .gallery img:first');
              $active.addClass('lastActive');
              $next.css({opacity: 0.0})
@@ Line 310: / Line 314: @@
                  });
          }
-         $('.no-touch #content #homeIndex a.experience').hover(function(){
+         $('.no-touch #realcontent #homeIndex a.experience').hover(function(){
              var $gallery = $(this).find('.gallery');
              $gallery.stop().animate({
@@ Line 350: / Line 354: @@
              }, 1400);
          }
-         $('.no-touch #content #homeIndex a.beer').hover(function(){
+         $('.no-touch #realcontent #homeIndex a.beer').hover(function(){
              swipeBeer.next();
              again();
@@ Line 359: / Line 363: @@
       </script>
-</body></html>
+</div></html>