tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
11
ZUGRIFFE
214
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 31.07.11 17:13 #1
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    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
     
    Zitieren Zitieren
  2. 31.07.11 17:24 #2
    Avatar von Momo95
    Momo95 Momo95 ist offline Mitglied Gold
    Registriert seit
    Feb 2011
    Ort
    Linkenheim
    Beiträge
    106
    HTML-Code:
    <!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>
    Angehängte Grafiken Angehängte Grafiken  
    Geändert von Momo95 (31.07.11 um 17:28 Uhr)
     
    Zitieren Zitieren
  3. 31.07.11 17:38 #3
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    Einwandfrei Danke.
     
    Zitieren Zitieren
  4. 31.07.11 17:41 #4
    Avatar von Momo95
    Momo95 Momo95 ist offline Mitglied Gold
    Registriert seit
    Feb 2011
    Ort
    Linkenheim
    Beiträge
    106
    wenn du wüßtest, was man mit jquery alles machen kann...
     
    Zitieren Zitieren
  5. 31.07.11 17:55 #5
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    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/
     
    Zitieren Zitieren
  6. 31.07.11 17:57 #6
    Avatar von Momo95
    Momo95 Momo95 ist offline Mitglied Gold
    Registriert seit
    Feb 2011
    Ort
    Linkenheim
    Beiträge
    106
    also das design ist mit css gemacht, die kleinen effekte (ein und ausblenden) mit jQuery und der inhalt wird mit php dynamisch eingefüht
    Geändert von Momo95 (31.07.11 um 18:09 Uhr)
     
    Zitieren Zitieren
  7. 31.07.11 18:15 #7
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    Ahh aber wie bekomm ich das in der mitte rein ohne den Inhalt.
     
    Zitieren Zitieren
  8. 31.07.11 18:19 #8
    Avatar von Momo95
    Momo95 Momo95 ist offline Mitglied Gold
    Registriert seit
    Feb 2011
    Ort
    Linkenheim
    Beiträge
    106
    du erstellst ein div und positionierst es mit css (so wie #leiste)
     
    Zitieren Zitieren
  9. 31.07.11 18:22 #9
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    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>
     
    Zitieren Zitieren
  10. 31.07.11 18:49 #10
    Avatar von Momo95
    Momo95 Momo95 ist offline Mitglied Gold
    Registriert seit
    Feb 2011
    Ort
    Linkenheim
    Beiträge
    106
    das ist ja schon gut. jetzt machst du für jedes element css-eigenschaften:

    Code :
    1
2
3
4
5
6
7
8
9
10
11
12

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

    vllt hilfts: http://www.css4you.de/
     
    Zitieren Zitieren
  11. 31.07.11 19:10 #11
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    Irgendwie blick ich nicht mehr durch...
     
    Zitieren Zitieren
  12. 31.07.11 21:57 #12
    EuropaChat EuropaChat ist offline Mitglied Gold
    Registriert seit
    Jun 2009
    Beiträge
    145
    Ich check nicht wie ich das mittig zentrier bzw. den kompletten CSS Text nicht.
     
    Zitieren Zitieren
« facebook / Google+ Button | Fehlerhafte Darstellung im IE »

Ähnliche Themen

  1. JButton neu designen
    Von ElJarno im Forum Swing, Java2D/3D, SWT, JFace
    Antworten: 6
    Letzter Beitrag: 11.06.10, 09:00
  2. Logo designen
    Von hever im Forum Stellenangebote (entgeltlich)
    Antworten: 0
    Letzter Beitrag: 29.10.08, 00:35
  3. DB richtig Designen
    Von Briefkasten im Forum Relationale Datenbanksysteme
    Antworten: 2
    Letzter Beitrag: 18.09.07, 09:37
  4. Tabelle(n) designen
    Von meilon im Forum Relationale Datenbanksysteme
    Antworten: 0
    Letzter Beitrag: 20.05.06, 21:09
  5. CD inlay designen
    Von Collateral im Forum Cinema 4D
    Antworten: 5
    Letzter Beitrag: 06.12.03, 18:27