Line 34: | Line 34: | ||
.imgleft:hover, .imgcenter:hover, .imgright:hover { | .imgleft:hover, .imgcenter:hover, .imgright:hover { | ||
background-color:#4db8ff; | background-color:#4db8ff; | ||
+ | } | ||
+ | |||
+ | /***************************************************Pop up css*****************************************/ | ||
+ | .popupbackground { | ||
+ | position:fixed; | ||
+ | top:0; | ||
+ | bottom:0; | ||
+ | right:0; | ||
+ | left:0; | ||
+ | background: rgba(0, 0, 0, 0.7); | ||
+ | visibility:hidden; | ||
+ | opacity:0; | ||
+ | transition:opacity 500ms; | ||
+ | } | ||
+ | |||
+ | .popupbackground:target { | ||
+ | visibility:visible; | ||
+ | opacity:1; | ||
+ | } | ||
+ | |||
+ | .popup { | ||
+ | width:1100px; | ||
+ | height:800px; | ||
+ | background-color:white; | ||
+ | left:50%; | ||
+ | top:50%; | ||
+ | margin-left:-550px; | ||
+ | margin-top:-400px; | ||
} | } | ||
Line 73: | Line 101: | ||
<div class="imgleft"> | <div class="imgleft"> | ||
− | <img src="https://static.igem.org/mediawiki/2016/f/fb/Mark.jpg"/> | + | <a href="#mark"><img src="https://static.igem.org/mediawiki/2016/f/fb/Mark.jpg"/></a> |
</div> | </div> | ||
Line 133: | Line 161: | ||
</div> | </div> | ||
</div> | </div> | ||
+ | |||
+ | |||
+ | <!------------------------------------------Pop up box divs-----------------------------------------------> | ||
+ | <div class="popupbackground" id="mark"> | ||
+ | <div class="popup"> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
</body> | </body> | ||
</html> | </html> |
Revision as of 14:14, 29 July 2016