|
|
Line 38: |
Line 38: |
| display: none; | | display: none; |
| } | | } |
| + | |
| + | body { |
| + | position: relative; |
| + | } |
| + | #section1 {padding-top:120px;height:500px;color: #000; background-color: #FAFAFA;} |
| + | #section2 {padding-top:120px;height:500px;color: #000; background-color: #FFFFFF;} |
| + | #section3 {padding-top:120px;height:500px;color: #000; background-color: #FAFAFA;} |
| + | #section4 {padding-top:120px;height:500px;color: #000; background-color: #FFFFFF;} |
| + | |
| + | } |
| </style> | | </style> |
| <body> | | <body> |
Line 46: |
Line 56: |
| </div> | | </div> |
| </div> | | </div> |
− | <div class="column full_size">
| |
− | <br>
| |
− | <style>
| |
− | body
| |
− |
| |
− | .tablink {
| |
− | background-color: #555;
| |
− | color: white;
| |
− | float: left;
| |
− | border: none;
| |
− | outline: none;
| |
− | cursor: pointer;
| |
− | padding: 14px 16px;
| |
− | font-size: 17px;
| |
− | width: 25%;
| |
− | }
| |
− |
| |
− | .tablink:hover {
| |
− | background-color: #777;
| |
− | }
| |
− |
| |
− | /* Style the tab content */
| |
− | .tabcontent {
| |
− | color: white;
| |
− | display: none;
| |
− | padding: 50px;
| |
− | text-align: center;
| |
− | }
| |
| | | |
− | #London {background-color:red;}
| |
− | #Paris {background-color:green;}
| |
− | #Tokyo {background-color:blue;}
| |
− | #Oslo {background-color:orange;}
| |
| </style> | | </style> |
| </head> | | </head> |
| <body> | | <body> |
| | | |
| + | <div class="whole-div"> |
| + | <div class="container-fluid"> |
| <div class="topnav" id="myTopnav"> | | <div class="topnav" id="myTopnav"> |
− | <a href="#local">Local public engagement</a> | + | <ul class="nav navbar-nav"> |
− | <a href="#international">International public engagement</a> | + | <li><a href="#section1">Local public engagement</a></li> |
− | <a href="#conference">iGEM conference</a> | + | <li><a href="#section2">International public engagement</a></li> |
− | <a href="#survey">Survey</a> | + | <li><a href="#section3">iGEM conference</a></li> |
| + | <li><a href="#section4">Survey</a></li> |
| + | </ul> |
| + | </div> |
| + | </div> |
| </div> | | </div> |
| <script> | | <script> |
Line 326: |
Line 310: |
| | | |
| </div> | | </div> |
− | <!-- Section "What We do" example 3: Small Title & 3 columns icons -->
| |
− | <div class="section section-we-do-2" id="workflow2">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="title">
| |
− | <p class = "h2WM">The Activities Booklet</p>
| |
− | </div>
| |
| | | |
| + | <script> |
| + | $(document).ready(function(){ |
| + | // Add scrollspy to <body> |
| + | $('body').scrollspy({target: ".navbar", offset: 50}); |
| | | |
− | <p>After hosting our workshops, we compiled 24 of the activities we ran with participants into a single Synthetic Biology educational booklet. Each activity lists the procedure, background information, materials and cost for the activity, critical learning questions, and learning goals. We made an effort to keep the activities low-cost and used materials easily accessible to teachers. We included background information so that teachers with limited Biology background could easily run the activities. The booklet includes worksheets, labs, and activities that can be completed by first graders to AP Biology students, and any age in between.
| + | // Add smooth scrolling on all links inside the navbar |
− | <br>We worked with Bonnie Ellis, the Science Curriculum Coordinator of Williamsburg James City County Public Schools to ensure that our booklet is usable and convenient for teachers.
| + | $("#myNavbar a").on('click', function(event) { |
− | | + | // Make sure this.hash has a value before overriding default behavior |
− | <br>
| + | if (this.hash !== "") { |
− | <b>Who we shared our booklet with:</b>
| + | // Prevent default anchor click behavior |
− | <br>
| + | event.preventDefault(); |
− | We have already shared our booklet with teachers all over the state, the country, and the world! Here in Williamsburg, we attended the Williamsburg James City County Teacher Training days to present our booklet to all the science teachers in the county. In addition, we have given our booklet to teachers all over the state. We now have teachers in five states who plan on running our booklet. We also provided our booklet upon request to teachers in China and, through the Fulbright U.S. Scholar Program, Malaysia.
| + | |
− | <br>
| + | |
− | We are still working on responding to all the requests for our booklet! Currently, we are working on providing the Virginia state learning standards that each activity fulfills so that local teachers can seamlessly integrate our activities into their year-long schedules. We are also providing local teachers with kits that include materials for our activities up until the date of the 2015 iGEM Jamboree.
| + | |
− | </p>
| + | |
− | <p>Our educational synthetic biology activities booklet is available online for anyone to use for free. This includes future iGEM teams looking to hold Synthetic Biology workshops and camps, as well as educators worldwide. Additionally, teachers in the Williamsburg area can request in-class assistance or tutoring for the booklet from volunteers of College Partnership for Kids. CPK is a group of William & Mary students who tutor at local schools. CPK volunteers will receive special training in order to use the activities in our Synthetic Biology booklet.
| + | |
− | </p>
| + | |
− | <p><b>Knowledge of Synthetic Biology: </b>The information we provided and taught to students and adults in our workshops will inspire them to look into Synthetic Biology and see scientific research as a more tangible career option. We have already received emails from parents whose kids couldn't stop talking about our workshops, and we feel certain that this enthusiasm for Synthetic Biology will carry them into the future.</p>
| + | |
− | <p><b>Lab visits: </b>We put our local public schools in contact with Dr. Saha, our iGEM PI, who will continue to organize and facilitate visits by classes to William and Mary Biology Department labs.</p></div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <!-- End Section "What We do" example 3: Small Title & 3 columns icons -->
| + | |
| | | |
| + | // Store hash |
| + | var hash = this.hash; |
| | | |
| + | // Using jQuery's animate() method to add smooth page scroll |
| + | // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area |
| + | $('html, body').animate({ |
| + | scrollTop: $(hash).offset().top |
| + | }, 800, function(){ |
| + | |
| + | // Add hash (#) to URL when done scrolling (default click behavior) |
| + | window.location.hash = hash; |
| + | }); |
| + | } // End if |
| + | }); |
| + | }); |
| + | </script> |
| | | |
| </html> | | </html> |
| | | |
| {{Template:Hong_Kong-CUHK_footer}} | | {{Template:Hong_Kong-CUHK_footer}} |