Leiste designen

EuropaChat · 31. Juli 2011

Hallo,

wer könnte mir helfen, so eine schwarze Leiste (links) auf dieser Webseite http://gallyapp.com/tf_themes/anan_wp/ zu designen? Habe hier meine Webseite http://wakestars.onpw.de/ und dort bräuchte ich so eine leiste links aber ohne Aufklappmenü, außer es macht sich jemand die Mühe und programmiert mir das zum aufklappen auch ? Wäre super. Weiß dort überhaupt nicht wie ich da anfangen soll.

danke gruß markus

Momo95 · 31. Juli 2011

HTML:

<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>
<style>
body {
    background-image:url('bg.JPG');
    background-size:100%;
    background-attachment:fixed;
    /*warte mal kurz ich google das mal nach*/
}
#leiste {
background-image:url('leiste.png');
position: fixed;
height: 100%;
top: 0px;
left: -150px;
width: 200px;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.js"></script>
	<script type="text/javascript">
		$(function() {
			$('#leiste').hover(function(){
				$(this).animate({left:'0px'},{queue:false,duration:500});
			}, function(){
				$(this).animate({left:'-150px'},{queue:false,duration:500});
			});
		});

		</script>
</head>
<body>
<div id="leiste"></div>
</body>
</html>

EuropaChat · 31. Juli 2011

Einwandfrei

Danke.

Momo95 · 31. Juli 2011

wenn du wüßtest, was man mit jquery alles machen kann...

EuropaChat · 31. Juli 2011

Ja hab gerade gegoogelt

. Wenn man jetzt auf http://www.gallyapp.com/tf_themes/anan_wp/?page_id=120 klickt ist mittig so ein Kästchen. Wie bekomm ich so einen bei mir rein auch mit Jquery?

Aktuell hab ich es so: http://wakestars.onpw.de/

Momo95 · 31. Juli 2011

also das design ist mit css gemacht, die kleinen effekte (ein und ausblenden) mit jQuery und der inhalt wird mit php dynamisch eingefüht

EuropaChat · 31. Juli 2011

Ahh

aber wie bekomm ich das in der mitte rein ohne den Inhalt.

Momo95 · 31. Juli 2011

du erstellst ein div und positionierst es mit css (so wie #leiste)

EuropaChat · 31. Juli 2011

Habs jetzt mal so gemacht, aber das CSS bekomme ich nicht ganz hin:

<div id="main">
<h2>About me</h2>
<div id="content">
<p class="text">

TEXT TEXT TEXT

</p>
</div>
</div>

Momo95 · 31. Juli 2011

das ist ja schon gut. jetzt machst du für jedes element css-eigenschaften:

Code:

#main {
...
}
#content {
...
}
.text {
...
}
h2 {
...
}

vllt hilfts: http://www.css4you.de/

Leiste designen

EuropaChat

Erfahrenes Mitglied

Momo95

Erfahrenes Mitglied

Anhänge

EuropaChat

Erfahrenes Mitglied

Momo95

Erfahrenes Mitglied

EuropaChat

Erfahrenes Mitglied

Momo95

Erfahrenes Mitglied

EuropaChat

Erfahrenes Mitglied

Momo95

Erfahrenes Mitglied

EuropaChat

Erfahrenes Mitglied

Momo95

Erfahrenes Mitglied

Neue Beiträge