splash-page-template.php

<?php
/*
Template Name: Splash Template
*/
?>
<?php get_header(); ?>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src= "http://sfpontona.se/wp/wp-content/themes/pontona_bones/library/js/libs/jquery.backstretch.min.js"></script>
<script language="JavaScript">


var backImage = new Array();


backImage[0] =  "http://sfpontona.se/wp/images/main.jpg";
backImage[1] =  "http://sfpontona.se/wp/images/produkter.jpg";
backImage[2] =  "http://sfpontona.se/wp/images/nyheter.jpg";
backImage[3] =  "";

function changeBGImage(whichImage){
if (document.body){
   document.body.style.backgroundImage = $.backstretch(backImage[whichImage],{speed: 1000});
}
}


</script>

<link rel="stylesheet" type="text/css" href="http://sfpontona.se/wp/wp-content/themes/startuppro-child/style.css">


</head>

<body>
<script>
    $.backstretch("http://sfpontona.se/wp/images/main.jpg");
</script>

<STYLE type="text/css">


  /* hide the title */
#site-title a, #site-title h1 a, #site-title h1{display:none;}

  /* hide the container too */
#container {background:transparent; margin-top:-500px;}

/*  send the menu to the top of the page   */

 header{top:0; width:1000px; position: fixed; z-index:9999;}


ul#floating {
   width:950px;
   display:inline-block;
   clear:left;
	/* float:left; */
   list-style:none;
   margin:0;
   padding:0;
   position:absolute;
   left: 50%;
   text-align:center;
   top: 75%;

}

#floating li {
	right:50%;
	text-align:center;
	position:relative;
	margin: 0;
	padding: 0;
    list-style: none;
    white-space: nowrap;

	display:inline-block;
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.20) 100%, rgba(0,0,0,0) 0%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(100%,rgba(0,0,0,0.20)), color-stop(0%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.20) 100%,rgba(0,0,0,0) 0%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.20) 100%,rgba(0,0,0,0) 0%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.20) 100%,rgba(0,0,0,0) 0%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.20) 100%,rgba(0,0,0,0) 0%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */


}
#floating li a:link,a:visited
{
	/* display:inline; */
	font-size: 1.5em;
	font-family: Arial, sans-serif;
	font-weight:500;
	color:#eee;

	text-align:center;
	padding: 5px 20px;
	text-decoration:none;
	text-transform:uppercase;

}
#floating li a:hover,a:active
{
	background-color:transparent;
	-webkit-transition: background-color 0.25s ease-in;
	-moz-transition: background-color 0.25s ease-in;
	-o-transition: background-color 0.25s ease-in;
	transition: background-color 0.25s ease-in;
}
#floating a:link,a:visited
{
	/* display:inline;  */
	font-size: 1.5em;
	font-family: Arial, sans-serif;
	font-weight:500;
	color:#eee;
	background-color:transparent;
	text-align:center;
	padding: 5px 20px;
	text-decoration:none;
	text-transform:uppercase;

}
#floating a:hover,a:active
{
	background-color:transparent;
	-webkit-transition: background-color 0.25s ease-in;
	-moz-transition: background-color 0.25s ease-in;
	-o-transition: background-color 0.25s ease-in;
	transition: background-color 0.25s ease-in;
}

#full-screen-background-image {
  z-index: -999;
  min-height: 100%;
  min-width: 1024px;
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
}
</style>
<div id = "first">

	 <div id= "second" class="center">
	   <span>
		<ul id="floating">
			<li id="floating"><a id="floating" href="http://sfpontona.se/wp/?page_id=1466" onMouseOver="javascript:changeBGImage(0)">Det viktigaste</a></li>
			<li id="floating"><a id="floating" href="http://sfpontona.se/wp/?page_id=150" onMouseOver="javascript:changeBGImage(1)">Produkter</a>	</li>
			<li id="floating"><a id="floating" href="http://sfpontona.se/wp/?page_id=148" onMouseOver="javascript:changeBGImage(2)">Nyheter</a></li>
		</ul>
	   </span>


  </div> <!-- end #second -->


</div>  <!-- end #first -->


</div> <!-- end #content -->