"
Team:NCTU Formosa/source/insectshow
From 2014.igem.org
(Difference between revisions)
(Created page with "<html> <style> .ch-item { width: 100%; height: 100%; border-radius: 50%; position: relative; box-shadow: 0 1px 2px rgba(0,0,0,0.1); cursor: default; } .ch...") |
|||
| (18 intermediate revisions not shown) | |||
| Line 12: | Line 12: | ||
.ch-info{ | .ch-info{ | ||
position: absolute; | position: absolute; | ||
| - | width: | + | width: 150px; |
| - | height: | + | height: 150px; |
border-radius: 50%; | border-radius: 50%; | ||
} | } | ||
| Line 33: | Line 33: | ||
background-position: center center; | background-position: center center; | ||
} | } | ||
| - | |||
.ch-info .ch-info-front { | .ch-info .ch-info-front { | ||
transition: all 0.6s ease-in-out; | transition: all 0.6s ease-in-out; | ||
} | } | ||
| - | |||
.ch-info .ch-info-back { | .ch-info .ch-info-back { | ||
opacity: 0; | opacity: 0; | ||
| Line 45: | Line 43: | ||
transition: all 0.4s ease-in-out 0.2s; | transition: all 0.4s ease-in-out 0.2s; | ||
} | } | ||
| + | .ch-item:hover .ch-info-front { | ||
| + | transform: scale(0); | ||
| + | opacity: 0; | ||
| + | } | ||
.ch-img-1 { | .ch-img-1 { | ||
| - | + | background-image: url('https://static.igem.org/mediawiki/2014/8/8d/2014_NCTU_Formosa_Moth_Mamestra_brassicae.jpg'); | |
| + | background-size: 130pt auto; | ||
} | } | ||
.ch-img-2 { | .ch-img-2 { | ||
| - | background: | + | background-image: url('https://static.igem.org/mediawiki/2014/d/d7/2014_NCTU_Formosa_Moth_Helicoverpa-armigera.jpg'); |
| + | background-size: 130pt auto; | ||
} | } | ||
.ch-img-3 { | .ch-img-3 { | ||
| - | background: | + | background-image: url('https://static.igem.org/mediawiki/2014/4/45/2014_NCTU_Formosa_Moth_Spodoptera_litura.jpg'); |
| + | background-size: 130pt auto; | ||
| + | } | ||
| + | |||
| + | .ch-img-4 { | ||
| + | background-image: url('https://static.igem.org/mediawiki/2014/b/b5/2014_NCTU_Formosa_Moth_Solenopsis_invicta.jpg'); | ||
| + | background-size: 130pt auto; | ||
| + | } | ||
| + | |||
| + | .ch-img-5 { | ||
| + | background-image: url('https://static.igem.org/mediawiki/2014/3/3e/2014_NCTU_Formosa_Moth_Mosquito.jpg'); | ||
| + | background-size: 142pt auto; | ||
| + | } | ||
| + | |||
| + | .ch-img-6 { | ||
| + | background-image: url('https://static.igem.org/mediawiki/2014/a/a3/2014_NCTU_Formosa_Moth_Agrotis_ipsilon.jpg'); | ||
| + | background-size: 130pt auto; | ||
| + | } | ||
| + | |||
| + | .ch-img-7 { | ||
| + | background-image: url('https://static.igem.org/mediawiki/2014/8/88/2014_NCTU_Formosa_Moth_Lymantria_dispar.jpg'); | ||
| + | background-size: 130pt auto; | ||
| + | } | ||
| + | .ch-img-8 { | ||
| + | background-image: url('https://static.igem.org/mediawiki/2014/0/0e/2014_NCTU_Formosa_Moth_Adoxophyes_sp1.jpg'); | ||
| + | background-size: 110pt auto; | ||
| + | } | ||
| + | .ch-img-9 { | ||
| + | background-image: url('https://static.igem.org/mediawiki/2014/3/3a/2014_NCTU_Formosa_Moth_Bombyx_mori.jpg'); | ||
| + | background-size: 130pt auto; | ||
} | } | ||
| + | |||
.ch-info h3 { | .ch-info h3 { | ||
color: #fff; | color: #fff; | ||
| Line 95: | Line 129: | ||
color: #fff; | color: #fff; | ||
} | } | ||
| - | |||
| - | |||
| - | |||
| - | |||
.ch-item:hover .ch-info-back { | .ch-item:hover .ch-info-back { | ||
transform: scale(1); | transform: scale(1); | ||
| Line 105: | Line 135: | ||
} | } | ||
</style> | </style> | ||
| + | </html> | ||
Latest revision as of 18:58, 17 October 2014
