无法改变身体的背景

时间：2014-11-26 12:51:36

标签： javascript jquery html css

我试图改变身体的背景。我想用5个不同的图像覆盖网页的背景，每个图像覆盖一个部分（第1页，第2页，第3页，第4页和第5页）。

但是现在当我尝试图像没有显示时。

到目前为止，我尝试过一张图像，并尝试将其作为背景图像。我试过用特定的背景制作一个div规则。我尝试了两种不同的图像。但似乎没有改变背景。

我已经声明了背景颜色，这样背景会改变，但图像似乎不起作用。

这是小提琴：http://jsfiddle.net/xjcwfey3/ 

<p>Seems I needed this to link jfiddle.</p>

请帮我找到问题所在。谢谢！

2 个答案:

答案 0 :(得分：0)

改变你的：

background-image:url(images/Animation_background.jpg);

要：

background-image:url(http://i3.kym-cdn.com/photos/images/facebook/000/511/991/3a5.jpg);

似乎工作正常，这意味着您可能无法访问images / Animation_background.jpg。

1）检查图像的URL，确保图像在浏览器中自行加载。 2）根据您的css文件修复图像的路径（您可能必须在图像路径中添加/）

答案 1 :(得分：0)

放大图片

*
{
	margin:0;
	padding:0;
	}
	


#wrap	{
	
	width:auto;
	height:auto;
	
}

body

{

		background:url(http://demo2.woothemes.com/memorable/files/2013/05/thai-food-580x352.jpg) no-repeat; 


}


#menu

{
	background-color:black;
	width:100%;
	position: fixed;
	opacity:1;
	
	}
	
	#menu ul

{
    width: 100%;
    padding: 0;
    margin: 0;
    list-style-type: none;
	}
#menu a	{
	color:white;
	background-color:black;
	display:block;
	float: left;
    width: 20%;
    text-decoration: none;
	text-align:center;
	padding-top:1%;
	padding-bottom:1%;

   
	
	}
	#menu a:hover
	{
	background-color:white;
	color:black;
	}
	
	li {
    display: inline;
}

#page1	{
	
	background-color:white;
	color:black;
	width:50%;
	height:100%;
	text-align:center;
	padding-top:5%;
	padding-bottom:3%;
	padding-right:10%;
	padding-left:10%;
	margin-bottom:5%;
	margin-left:15%;
	border-radius: 20px 20px 59px 20px;
-moz-border-radius: 20px 20px 59px 20px;
-webkit-border-radius: 20px 20px 59px 20px;
border: 0px solid #000000;
-webkit-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
-moz-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);

	}
	
	#page2	{
	
	background-color:white;
	color:black;
	width:50%;
	height:100%;
	padding-bottom:3%;
	padding-top:3%;
	padding-right:10%;
	padding-left:10%;
		margin-bottom:5%;
			margin-left:15%;

border-radius: 20px 20px 59px 20px;
-moz-border-radius: 20px 20px 59px 20px;
-webkit-border-radius: 20px 20px 59px 20px;
border: 0px solid #000000;
-webkit-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
-moz-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
	}
	
	#page3	{
	
	background-color:white;
	color:black;
	width:50%;
	height:100%;
	padding-bottom:3%;
	padding-top:3%;
	padding-right:10%;
	padding-left:10%;
		margin-bottom:5%;
			margin-left:15%;

border-radius: 20px 20px 59px 20px;
-moz-border-radius: 20px 20px 59px 20px;
-webkit-border-radius: 20px 20px 59px 20px;
border: 0px solid #000000;
-webkit-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
-moz-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
	}
	
	#page4	{
	
	background-color:white;
	color:black;
	width:50%;
	height:100%;
	padding-bottom:3%;
	padding-top:3%;
	padding-right:10%;
	padding-left:10%;
			margin-bottom:5%;
	margin-left:15%;

		marginborder-radius: 20px 20px 59px 20px;
-moz-border-radius: 20px 20px 59px 20px;
-webkit-border-radius: 20px 20px 59px 20px;
border: 0px solid #000000;-bottom:5%;
-webkit-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
-moz-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);

	}
	
	#page5	{
	
	background-color:white;
	color:black;
	width:50%;
	height:100%;
	padding-bottom:3%;
	padding-top:3%;
	padding-right:10%;
	padding-left:10%;
		margin-bottom:5%;
			margin-left:15%;

border-radius: 20px 20px 59px 20px;
-moz-border-radius: 20px 20px 59px 20px;
-webkit-border-radius: 20px 20px 59px 20px;
border: 0px solid #000000;
-webkit-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
-moz-box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
box-shadow: 6px 7px 5px 8px rgba(128,123,128,0.54);
	}
	
	p	{
		font-family:"Comic Sans MS", cursive;}
<!-- http://localhost/portfolio/index.php  -->
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Portfolio</title>
<link href="style.css" type="text/css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>

<body>

<!-- Menyn -->
<div id="menu">
     <ul>
         <li><a href="#about">About</a></li>
         <li><a href="#portfolio">Portfolio</a></li>
         <li><a href="#contact">Contact</a></li>
         <li><a href="#home">Home</a></li>
         <li><a href="#random">Random</a></li>
     </ul>
</div>
<div id="wrap">

<!-- Hemsidan i sin helhet-->
<div id="page1">
  <a id="about"></a>
  <h3> First Part</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada, dolor a sagittis placerat, nisi sem porttitor orci, 
non rutrum velit velit sed enim. Aliquam imperdiet, quam ac maximus suscipit, mauris lorem volutpat dui, quis imperdiet leo dolor a nunc.
 Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quis sodales tortor. Sed porta nisl sed massa ullamcorper, a porttitor justo malesuada. Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quiCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qu</div>

<div id="page2">
  <a id="portfolio"></a>
  <h3> Second Part</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada, dolor a sagittis placerat, nisi sem porttitor orci, 
non rutrum velit velit sed enim. Aliquam imperdiet, quam ac maximus suscipit, mauris lorem volutpat dui, quis imperdiet leo dolor a nunc.
 Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quis sodales tortor. Sed porta nisl sed massa ullamcorper, a porttitor justo malesuada. Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui</div>

<div id="page3">
  <a id="contact"></a>
  <h3> Third Part</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada, dolor a sagittis placerat, nisi sem porttitor orci, 
non rutrum velit velit sed enim. Aliquam imperdiet, quam ac maximus suscipit, mauris lorem volutpat dui, quis imperdiet leo dolor a nunc.
 Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quis sodales tortor. Sed porta nisl sed massa ullamcorper, a porttitor justo malesuada. Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quiCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qu</div>

<div id="page4">
  <a id="home"></a>
  <h3> Forth Part</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada, dolor a sagittis placerat, nisi sem porttitor orci, 
non rutrum velit velit sed enim. Aliquam imperdiet, quam ac maximus suscipit, mauris lorem volutpat dui, quis imperdiet leo dolor a nunc.
 Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quis sodales tortor. Sed porta nisl sed massa ullamcorper, a porttitor justo malesuada. Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui</div>

<div id="page5">
  <a id="random"></a>
  <h3> Fifth Part</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada, dolor a sagittis placerat, nisi sem porttitor orci, 
non rutrum velit velit sed enim. Aliquam imperdiet, quam ac maximus suscipit, mauris lorem volutpat dui, quis imperdiet leo dolor a nunc.
 Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quis sodales tortor. Sed porta nisl sed massa ullamcorper, a porttitor justo malesuada. Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quiCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec quCurabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qui Nunc pulvinar eu massa
 aliquam tincidunt. Cras tincidunt dolor sagittis laoreet posuere. 
 Fusce id bibendum libero. Vestibulum auctor nulla dolor, sit amet sollicitudin sem varius in. Aenean ullamcorper mauris in magna luctus, ac fringilla massa tincidunt. 
 Cras vitae eros diam. Vestibulum viverra aliquam mi, vel tempus mauris luctus id. Curabitur convallis lobortis ipsum facilisis fringilla. Pellentesque vel nibh augue. 
 Vestibulum gravida, felis nec efficitur tempus,
  odio diam feugiat risus, ac molestie nulla lorem vel tellus. 
Donec qu</div>
</div><!-- DIV WRAP END -->

<!-- Koder längst ner för en enkelt övergång animation när man klickar länk -->
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
                $(".contactLink").click(function(){
                    if ($("#contactForm").is(":hidden")){
                        $("#contactForm").slideDown("slow");
                    }
                    else{
                        $("#contactForm").slideUp("slow");
                    }
                });
            });
            function closeForm(){
                $("#messageSent").show("slow");
                setTimeout('$("#messageSent").hide();$("#contactForm").slideUp("slow")', 2000);
           }

$(document).ready(function() {
  function filterPath(string) {
    return string
      .replace(/^\//,'')
      .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
      .replace(/\/$/,'');
  }
  $('a[href*=#]').each(function() {
    if ( filterPath(location.pathname) == filterPath(this.pathname)
    && location.hostname == this.hostname
    && this.hash.replace(/#/,'') ) {
      var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) +']');
      var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false;
       if ($target) {
         var targetOffset = $target.offset().top;
         $(this).click(function() {
           $('html, body').animate({scrollTop: targetOffset}, 1000);
           var d = document.createElement("div");
        d.style.height = "101%";
        d.style.overflow = "hidden";
        document.body.appendChild(d);
        window.scrollTo(0,scrollToM);
        setTimeout(function() {
        d.parentNode.removeChild(d);
            }, 10);
           return false;
         });
      }
    }
  });
});

</script>
<!-- Menu fade -->


<script type="text/javascript">

       var $menu = $("#menu");
    var opacity = $menu.css("opacity");
    var scrollStopped;

    var fadeInCallback = function () {
        if (typeof scrollStopped != 'undefined') {
            clearInterval(scrollStopped);
        }

        scrollStopped = setTimeout(function () {
            $menu.animate({ opacity: 1 }, "slow");
        }, 1000);
    }

    $(window).scroll(function () {
        if (!$menu.is(":animated") && opacity == 1) {
            $menu.animate({ opacity: 0 }, "slow", fadeInCallback);
        } else {
            fadeInCallback.call(this);
        }
    });
</script>

<script>
tiles = $("#page5, #page2, #page3, #page4").fadeTo(0, 0);

$(window).scroll(function(d,h) {
    tiles.each(function(i) {
        a = $(this).offset().top + $(this).height();
        b = $(window).scrollTop() + $(window).height();
        if (a < b) $(this).fadeTo(1000,1);
    });
});


</script>
</body>
</html>

相关问题
最新问题