Difference between revisions of "Team:NCTU Formosa/Project"
Line 1: | Line 1: | ||
{{Team:NCTU_Formosa/navigation}} | {{Team:NCTU_Formosa/navigation}} | ||
+ | <html> | ||
+ | <head> | ||
+ | |||
+ | <style> | ||
+ | img { | ||
+ | display: inline; | ||
+ | width: 100%; | ||
+ | } | ||
+ | body{ | ||
+ | background-color:#FCFCDE;} | ||
+ | /* | ||
+ | * DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | ||
+ | * Version 2, December 2004 | ||
+ | * | ||
+ | * Copyright (C) 2014 Tim Severien | ||
+ | * | ||
+ | * Everyone is permitted to copy and distribute verbatim or modified | ||
+ | * copies of this license document, and changing it is allowed as long | ||
+ | * as the name is changed. | ||
+ | * | ||
+ | * DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE | ||
+ | * TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION | ||
+ | * | ||
+ | * 0. You just DO WHAT THE FUCK YOU WANT TO. | ||
+ | */ | ||
+ | |||
+ | @font-face { | ||
+ | font-family: 'taggd'; | ||
+ | src: url('../fonts/taggd.eot'); | ||
+ | src: url('../fonts/taggd.eot#iefix') format('embedded-opentype'), | ||
+ | url('../fonts/taggd.woff') format('woff'), | ||
+ | url('../fonts/taggd.ttf') format('truetype'), | ||
+ | url('../fonts/taggd.svg#taggd') format('svg'); | ||
+ | font-weight: normal; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper { | ||
+ | overflow: hidden; | ||
+ | position: relative; | ||
+ | |||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: antialiased; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper .taggd-item { | ||
+ | background-color: #FF6668; | ||
+ | opacity:0.9; | ||
+ | cursor: pointer; | ||
+ | display: block; | ||
+ | padding: 14px; | ||
+ | z-index: 1000; | ||
+ | |||
+ | -webkit-border-radius: 50%; | ||
+ | -moz-border-radius: 50%; | ||
+ | border-radius: 50%; | ||
+ | |||
+ | -webkit-transition: background-color 0.2s; | ||
+ | -moz-transition: background-color 0.2s; | ||
+ | transition: background-color 0.2s; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper .taggd-item.active, | ||
+ | .taggd-wrapper .taggd-item:hover { background-color: rgba(219, 50, 92, 0.75); } | ||
+ | |||
+ | .taggd-wrapper .taggd-item-hover { | ||
+ | background-color: rgb(219, 50, 92); | ||
+ | color: transparent; | ||
+ | cursor: default; | ||
+ | display: block; | ||
+ | font-weight: lighter; | ||
+ | opacity: 0; | ||
+ | overflow: hidden; | ||
+ | padding: 0 10px; | ||
+ | z-index: 999; | ||
+ | |||
+ | -webkit-border-radius: 4px; | ||
+ | -moz-border-radius: 4px; | ||
+ | border-radius: 4px; | ||
+ | |||
+ | -webkit-transition: all 0.2s; | ||
+ | -moz-transition: all 0.2s; | ||
+ | transition: all 0.2s; | ||
+ | |||
+ | -webkit-touch-callout: none; | ||
+ | -webkit-user-select: none; | ||
+ | -khtml-user-select: none; | ||
+ | -moz-user-select: none; | ||
+ | -ms-user-select: none; | ||
+ | user-select: none; | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper .taggd-item-hover.show { | ||
+ | color: #fff; | ||
+ | opacity: 1; | ||
+ | padding: 10px; | ||
+ | z-index: 1000; | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper .taggd-item-hover input { | ||
+ | background-color: transparent; | ||
+ | border: 0; | ||
+ | margin: 0; | ||
+ | outline: 0; | ||
+ | padding: 0; | ||
+ | |||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: antialiased; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper .taggd-item-hover button { | ||
+ | background-color: #fff; | ||
+ | border: 0; | ||
+ | color: rgb(219, 50, 92); | ||
+ | font-family: 'taggd', sans-serif; | ||
+ | font-size: 0.666em; | ||
+ | height: 1.5em; | ||
+ | line-height: 1; | ||
+ | margin: 0 0 0 0.25em; | ||
+ | padding: 0; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | width: 1.5em; | ||
+ | |||
+ | -moz-border-radius: 50%; | ||
+ | -webkit-border-radius: 50%; | ||
+ | border-radius: 50%; | ||
+ | |||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: antialiased; | ||
+ | } | ||
+ | |||
+ | .taggd-wrapper .taggd-editor { | ||
+ | position: absolute; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | <script src="https://2015.igem.org/Team:NCTU_Formosa/source/taggd?action=raw&ctype=text/javascript"></script> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div style="text-align:center"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/7/71/Nctu_formosa_map.png" class="taggd" alt=""/> | ||
+ | </div> | ||
+ | <script> | ||
+ | var options = { | ||
+ | align: { | ||
+ | y: 'top' | ||
+ | }, | ||
+ | |||
+ | offset: { | ||
+ | top: 20 | ||
+ | }, | ||
+ | handlers: { | ||
+ | click: function( e, data ) { | ||
+ | window.open( | ||
+ | 'https://2015.igem.org/Team:NCTU_Formosa/' + data.uri, | ||
+ | '_blank' | ||
+ | );}, | ||
+ | mouseenter: 'show', | ||
+ | mouseleave: 'hide' | ||
+ | } | ||
+ | |||
+ | }; | ||
+ | |||
+ | var data = [ | ||
+ | { | ||
+ | "x": 0.16085954446854664, | ||
+ | "y": 0.8700758867667121, | ||
+ | "text": "Policy & Practices", | ||
+ | uri: 'Practices' | ||
+ | }, | ||
+ | { | ||
+ | "x": 0.4146556399132321, | ||
+ | "y": 0.8946325034106412, | ||
+ | "text": "Team", | ||
+ | uri: 'Attributions' | ||
+ | }, | ||
+ | { | ||
+ | "x": 0.4059788503253796, | ||
+ | "y": 0.30118093451568895, | ||
+ | "text": "Project", | ||
+ | uri: 'Description' | ||
+ | }, | ||
+ | { | ||
+ | "x": 0.5664994577006508, | ||
+ | "y": 0.23569662346521145, | ||
+ | "text": "Parts", | ||
+ | uri: 'Parts' | ||
+ | }, | ||
+ | { | ||
+ | "x": 0.7205124728850325, | ||
+ | "y": 0.4539776603001364, | ||
+ | "text": "Achievement", | ||
+ | uri: 'Achievement' | ||
+ | }, | ||
+ | { | ||
+ | "x": 0.29968817787418656, | ||
+ | "y": 0.291631139154161, | ||
+ | "text": "Notebook", | ||
+ | uri: 'LabSafety' | ||
+ | } | ||
+ | ] | ||
+ | |||
+ | var taggd = $('.taggd').taggd( options, data ); | ||
+ | </script> | ||
+ | |||
+ | </body> | ||
+ | </html> | ||
{{Team:NCTU_Formosa/footer}} | {{Team:NCTU_Formosa/footer}} |
Revision as of 17:28, 18 September 2015