| Autor | Zpráva | ||
|---|---|---|---|
| jozo1606 Profil |
#1 · Zasláno: 18. 5. 2013, 13:14:21
Ahojte, vedel by mi niekto poradiť ako spraviť header
Panoramatická fotka, ked pridem myškou naň, tak sa bude posuvať podľa toho kde mam prave myšku niečo na tento štyl ... Myslim toto : www.bardejov.sk/mesto/ Vopred ďakujem popripade niečo pre wordpress hmm ? |
||
| MyShare Profil |
#2 · Zasláno: 18. 5. 2013, 14:35:50
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="http://www.bardejov.sk/mesto/templates/bardejov/js/jquery.min.js"></script>
</head>
<body>
<div class="wrap header">
<div id="port">
<!-- Seven image layers, each layer slightly bigger than the one behind, making 'closer' layers move faster. -->
<img class="parallax-layer" src="http://www.bardejov.sk/mesto/templates/bardejov/images/paralax/obloha.jpg" alt="" style="width:1960px; height:280px;"/>
<img class="parallax-layer" src="http://www.bardejov.sk/mesto/templates/bardejov/images/paralax/logo.png" alt="" style="width:1940px; height:280px;"/>
<img class="parallax-layer" src="http://www.bardejov.sk/mesto/templates/bardejov/images/paralax/mesto.png" alt="mesto bardejov" style="width:1920px; height:280px;"/>
</div>
</div>
<script src="http://www.bardejov.sk/mesto/templates/bardejov/js/jquery.parallax.min.js" type="text/javascript"></script>
<script src="http://www.bardejov.sk/mesto/templates/bardejov/js/vticker.js" type="text/javascript"></script>
<script src="http://www.bardejov.sk/mesto/templates/bardejov/js/bardejov.js" type="text/javascript"></script>
</body>
</html>CSS * {
margin: 0;
padding: 0;
}
body {
margin: 0;
padding: 0;
}
.wrap {
float: left;
width: 100%;
}
.header {
/* background: url('../images/bg_header.jpg') center top no-repeat; */
height: 280px;
}
#header {
background: url('http://www.bardejov.sk/mesto/templates/bardejov/images/bg_topper.png') center top no-repeat;
width: 960px; /* height: 305px; */;
height: 115px;
margin: 0 auto;
position: relative;
}
#port {
background: none repeat scroll 0 0 #2F3134;
height: 280px;
overflow: hidden;
position: absolute;
width: 100%;
}
.parallax-viewport {
position: relative; /* relative, absolute, fixed */;
overflow: hidden;
}
.parallax-layer {
position: absolute;
}Samozrejme len ako ukážka kódu :) |
||
| Chamurappi Profil |
#3 · Zasláno: 18. 5. 2013, 15:36:46
Reaguji na joza1606:
Řekl bych, že na to stačí jeden řádek. Pokud má být hlavička přes celou šířku stránky: <div onmousemove="this.style.backgroundPosition = event.clientX / this.offsetWidth * 100 + '% 0';"> <div>u…
|
||
| jozo1606 Profil |
#4 · Zasláno: 19. 5. 2013, 11:34:41
a neviete mi poradiť ako to vopchat do wordpressu ?
chapem upraviť header.php, style.css no čo tam zadať z toho čo ste napisali ťažko povedať :/ |
||
|
Časová prodleva: 12 let
|
|||
0