Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag18.03.2013 um 18:44 (UTC)    
Titel: Fixiertes Div unter Navigation

HAllo ihr Spezis!
Ich hab schon viele Tipps hier im Forum gefunden und bastle mich ganz sachte durch meine Seite.
Ich habe auch ein Bild unter meine Navileiste bekommen, nun hätte ich gerne, dass das Bild beim runterscrollen mitläuft! Ist das möglich und wenn, wie muss ich den css-Code ändern?
So sieht er momentan aus: td.edit_below_nav img{visibility: hidden;}
td.edit_below_nav{background-image: url(http://img.webme.com/pic/b/bza-ev/logokopie.png);
background-position: center top;background-repeat: no-repeat;}
KAnn mir da jemand weiter helfen?
DAnke, Inka

Editiert by matsk: Ich habe den Titel etwas umformuliert.


Zuletzt bearbeitet von BZA-eV am 19.03.2013, 19:16, insgesamt 2-mal bearbeitet
Beitrag18.03.2013 um 19:32 (UTC)    
Titel:

kannst es ja mit overlay "überlagern", scrollt dann immer mit!
Beitrag19.03.2013 um 17:42 (UTC)    
Titel:

Wie meinste ueberlagern[color=red][/color]
Beitrag19.03.2013 um 18:14 (UTC)    
Titel:

Guten Abend,
na klar ist das möglich. Du musst einfach in dem Feld "Text über dem Design" folgenden Script einbauen. Deinen alten müssten wir dafür allerdings verwerfen.

Zitat:
<div id="bild_unter_navi" style="position:fixed; top:300px;margin-left:30px;"><img src="http://img.webme.com/pic/b/bza-ev/logoig2.png" style="width:250px;"></div>


Erklärungen:
Arrow Die rot markierte Stelle gibt mit "fixed" an, dass das DIV fixiert sein soll und mitscrollt.
Arrow Die blaue Markierung gibt an, was für einen Abstand dein Bild vom oberen Browser-Rand haben muss.
Arrow Die dunkel-Markierung gibt wiederum den Abstand vom linken Bildschirmrand an.
Arrow Und zur guter Letzt: Die Markierung ist Cyan gibt an, welche Breite dein Bild haben soll.


Ich hoffe ich konnte helfen. Falls du noch Fragen hast, immer her damit Smile.

Beste Grüße,
Mats
Beitrag19.03.2013 um 19:17 (UTC)    
Titel:

pffft, klingt gaaaanz einfach. Könnt ihr das nicht in meinen schon bestehenden einfügen? Bzw. ich schau mal wo die Stelle ist...
Beitrag19.03.2013 um 19:22 (UTC)    
Titel:

JA, doch nicht so einfach. Hier ist der das, was momentan über dem Design liegt. DAS WIRD AUCH NICHT VERWORFEN!
Wo muß ich das nun reinbasteln?
</style><style type="text/css">
<!--
table.edit_main_table{width: 100% !important;}
table.edit_main_table, table[height="102"]{margin: 0 auto;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 5% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 5% !important;position: absolute;left: -300px;}
td.edit_rechts_cbg{width:100%;}
td.shouty{visibility: hidden;width: 0px;}
td.edit_rechts_sbg{visibility:hidden;}
td.sidebar_heading{visibility: hidden;}
td.headline{visibility:hidden;}
td.headline2{visibility:hidden;}

td.edit_main_tr{height: 0px !important;}
td.edit_rechts_cbg{height: 0px !important;}
td.edit_rechts_bottom{height: 0px !Important;}
td.edit_navi_headbg{height: 0px !important;}

td.nav:hover{background-image: url(http://img.webme.com/pic/d/designcodes/buttonblau2.png);width:
185px;height: 27px;border: 1px solid #969696; }

td.nav{background-image: url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);width:
185px;height: 27px;border: 1px solid #969696;}

td.edit_below_nav img{visibility: hidden;}
td.edit_below_nav{background-image: url(http://img.webme.com/pic/b/bza-ev/logokopie.png);
background-position: center top;background-repeat: no-repeat;}

td.edit_content{background-image:url(http://img.webme.com/pic/d/designcodes/content2.png);background-color:#c0c0c0;border: 1px solid #c0c0c0;}
td.edit_rechts_cbg{background-image: url();}

td.edit_navi_headbg{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

td.edit_rechts_sbg{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

td.edit_rechts_bottom{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

body {background-image:url(http://img.webme.com/pic/d/designcodes/bodygraumarmor.jpg);background-color:#c0c0c0;}
body {background-attachment:fixed;border: 0px solid #c0c0c0;}

td.nav_heading{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}
td.sidebar_heading{background-image:url();height: 0px;}

td.edit_rb_footer{background-image:url();height: 20px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_top{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_top:hover{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_bottom2{background-image:url(URL);background-color:#XXXXXX;border: 0px solid #ffffff;}
td.edit_content_bottom{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 1px solid #c0c0c0;}

td.nav_heading{font-family: tahoma;font-size: 11px;color: #ffffff;padding-left:26px;text-align: left;}
td.nav a{font-family: tahoma;font-size: 11px;color: #ffffff;text-decoration: none}
td.sidebar_heading{font-family: tahoma;font-size: 11px;color: #000000; text-align: center;}

td.edit_content_main div{overflow: hidden!important;}

td.edit_header_full{background-image:url(http://img.webme.com/pic/b/bza-ev/kopf3.png);background-color:#XXXXXX;width:
1500; height: 300px;background-repeat: no-repeat;background-position: center top;border: 1px solid #c0c0c0;}
--></style>
Beitrag19.03.2013 um 19:32 (UTC)    
Titel:

Hey Kumpel,
alles wird gut Razz. Hier einmal das fertige Script zum Einbinden. Die blaue Stelle habe ich editiert und die rote Stelle hinzugefügt. Bei der roten Stelle musst du allerdinsg für die richtige Positionierung noch die Einstellungen wie oben beschrieben vornehmen.
Zitat:
</style><style type="text/css">
<!--
table.edit_main_table{width: 100% !important;}
table.edit_main_table, table[height="102"]{margin: 0 auto;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 5% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 5% !important;position: absolute;left: -300px;}
td.edit_rechts_cbg{width:100%;}
td.shouty{visibility: hidden;width: 0px;}
td.edit_rechts_sbg{visibility:hidden;}
td.sidebar_heading{visibility: hidden;}
td.headline{visibility:hidden;}
td.headline2{visibility:hidden;}

td.edit_main_tr{height: 0px !important;}
td.edit_rechts_cbg{height: 0px !important;}
td.edit_rechts_bottom{height: 0px !Important;}
td.edit_navi_headbg{height: 0px !important;}

td.nav:hover{background-image: url(http://img.webme.com/pic/d/designcodes/buttonblau2.png);width:
185px;height: 27px;border: 1px solid #969696; }

td.nav{background-image: url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);width:
185px;height: 27px;border: 1px solid #969696;}

td.edit_below_nav img{visibility: hidden;}
td.edit_below_nav{visibility: hidden;}

td.edit_content{background-image:url(http://img.webme.com/pic/d/designcodes/content2.png);background-color:#c0c0c0;border: 1px solid #c0c0c0;}
td.edit_rechts_cbg{background-image: url();}

td.edit_navi_headbg{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

td.edit_rechts_sbg{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

td.edit_rechts_bottom{background-image:url();background-color:#XXXXXX;border: 0px solid #ffffff;}

body {background-image:url(http://img.webme.com/pic/d/designcodes/bodygraumarmor.jpg);background-color:#c0c0c0;}
body {background-attachment:fixed;border: 0px solid #c0c0c0;}

td.nav_heading{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}
td.sidebar_heading{background-image:url();height: 0px;}

td.edit_rb_footer{background-image:url();height: 20px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_top{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_top:hover{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 0px solid #c0c0c0;}

td.edit_content_bottom2{background-image:url(URL);background-color:#XXXXXX;border: 0px solid #ffffff;}
td.edit_content_bottom{background-image:url(http://img.webme.com/pic/d/designcodes/buttonblau1.png);height: 24px;background-color:#XXXXXX;border: 1px solid #c0c0c0;}

td.nav_heading{font-family: tahoma;font-size: 11px;color: #ffffff;padding-left:26px;text-align: left;}
td.nav a{font-family: tahoma;font-size: 11px;color: #ffffff;text-decoration: none}
td.sidebar_heading{font-family: tahoma;font-size: 11px;color: #000000; text-align: center;}

td.edit_content_main div{overflow: hidden!important;}

td.edit_header_full{background-image:url(http://img.webme.com/pic/b/bza-ev/kopf3.png);background-color:#XXXXXX;width:
1500; height: 300px;background-repeat: no-repeat;background-position: center top;border: 1px solid #c0c0c0;}
--></style>

<div id="bild_unter_navi" style="position:fixed; top:300px;margin-left:30px;"><img src="http://img.webme.com/pic/b/bza-ev/logoig2.png" style="width:250px;"></div>


Beste Grüße,
Mats
Beitrag21.03.2013 um 22:39 (UTC)    
Titel:

Ahhhh DANKE! War je Tatsache ganz simpel..naja für jemanden der weiss wie Mr. Green !
Beitrag22.03.2013 um 12:23 (UTC)    
Titel:

Alles klar, danke für die Rückmeldund!

Beste Grüße,
Mats
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de