Team:Arizona State/template header

From 2012.igem.org

(Difference between revisions)
(Blanked the page)
 
(2 intermediate revisions not shown)
Line 1: Line 1:
 +
<html>
 +
<head>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 +
<style>
 +
div.bgcarousel{ /* CSS for main carousel container */
 +
background: black url(http://www.dynamicdrive.com/dynamicindex14/ajaxload.gif) center center no-repeat;
 +
/* loading gif while caoursel is loading */
 +
width:700px; /* default dimensions of carousel */
 +
height:500px;
 +
}
 +
 +
img.navbutton{ /* CSS for the nav buttons */
 +
margin:5px;
 +
opacity:0.7;
 +
}
 +
 +
div.slide{ /* CSS for each image's DIV container within main container */
 +
background-color: black;
 +
background-position: center center; /* center image within carousel */
 +
background-repeat: no-repeat;
 +
background-size: cover; /* CSS3 property to scale image within container? "cover" or "contain" */
 +
color: black;
 +
}
 +
 +
div.selectedslide{ /* CSS for currently selected slide */
 +
}
 +
 +
div.slide div.desc{ /* DIV that contains the textual description inside .slide */
 +
position: absolute;
 +
color: white;
 +
left: 40px;
 +
top: 100px;
 +
width:200px;
 +
padding: 10px;
 +
font: bold 16px sans-serif, Arial;
 +
text-shadow: 0 -1px 1px #8a8a8a; /* CSS3 text shadow */
 +
z-index:5;
 +
}
 +
 +
div.selectedslide div.desc{ /* CSS for currently selected slide's desc div */
 +
}
 +
 +
div.slide div.desc h2{
 +
font-size:150%;
 +
margin:0;
 +
}
 +
 +
div.slide div.desc a{
 +
color:yellow;
 +
text-decoration:none;
 +
}
 +
</style>
 +
 +
<script src="http://www.dynamicdrive.com/dynamicindex14/bgcarousel.js" type="text/javascript">
 +
/***********************************************
 +
* Background Image Carousel- © Dynamic Drive (www.dynamicdrive.com)
 +
* This notice MUST stay intact for legal use
 +
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
 +
***********************************************/
 +
</script>
 +
 +
<script type="text/javascript">
 +
var firstbgcarousel=new bgCarousel({
 +
wrapperid: 'mybgcarousel', //ID of blank DIV on page to house carousel
 +
 +
imagearray: //["image_path", "optional description"]
 +
[
 +
  ["https://static.igem.org/mediawiki/2012/3/3e/Blue_Water-_Main_Image_copy.png", ' '],
 +
  ["https://static.igem.org/mediawiki/2012/9/9c/Regional_Photo.jpg", ' '],
 +
  ["https://static.igem.org/mediawiki/2012/3/3f/Production_Pipeline.png", ' ']
 +
  //<--no trailing comma after very last image element!
 +
],
 +
 +
displaymode: {type:'auto', pause:3000, cycles:2, stoponclick:false, pauseonmouseover:true},
 +
navbuttons: ['http://www.dynamicdrive.com/dynamicindex14/left.gif', 'http://www.dynamicdrive.com/dynamicindex14/right.gif', 'http://www.dynamicdrive.com/dynamicindex14/up.gif', 'http://www.dynamicdrive.com/dynamicindex14/down.gif'], // path to nav images
 +
activeslideclass: 'selectedslide', // CSS class that gets added to currently shown DIV slide
 +
orientation: 'h', //Valid values: "h" or "v"
 +
persist: true, //remember last viewed slide and recall within same session?
 +
slideduration: 500 //transition duration (milliseconds)
 +
})
 +
</script>
 +
</head>
 +
 +
<body>
 +
<br /><br />
 +
<div id="mybgcarousel" class="bgcarousel"></div>
 +
</body>
 +
</html>

Latest revision as of 07:23, 25 October 2012



Retrieved from "http://2012.igem.org/Team:Arizona_State/template_header"