Guten tag,
könnte mir jemand mit dem Code helfen?
z.Z sieht das Design so aus:
www.GWE-2Herren.de.tl
und soll so aussehen:
http://img.webme.com/pic/g/gwe-2herren/designgwe.png
Was ich für Hilfe brauche?
-> der content soll still stehen und nicht größer werden, den content soll man scrollen können und somit das design um 20px breiter machen.
bei der navi soll die farbe ( #41af77 ) für die weißen lücken ersetzt werden.
genau das selbe soll bei den rechten boxen passieren, der komplette hintergrund der boxen soll ( #41af77 ) sein.
würde mich freuen wenn jemand ein feedback gibt oder mir direkt helfen könnte.
Der Code:
Code: <center><style type="text/css" typ="text/css"> <!--
/* Nullformatierung für alle Browser */
*{margin:0px; padding:0px;}
/* Hintergrund hinter Design */
body {
background-color: #000000;
background-image: url(http://img.webme.com/pic/a/akimkin/bg123.jpg);
background-repeat: repeat;
align: center;
background-attachment: ; }
/* Werbung über Design mittig */
table[height="102"] { margin: auto; }
/* Das Design mittig - zentriert ausrichten */
table.edit_main_table { margin: auto; }
/* Design kürzen (kein scrollen des Designs bei kurzen Seiten) */
td.edit_main_tr {
height: 50% !important; }
/* Schriftfarbe + Größe Baukasten-Extras */
td {
color: #000000;
font-size: 14px;
text-align: left;
font-family: arial,verdana; }
/* Schriftfarbe und Größe Seiteninhalt */
DIV {
color: #000000;
font-size: 14px;
text-align: left;
font-family: arial,verdana; }
/* Header oben */
td.edit_header_full {
background-color: #FFFFFF;
height: 261px;
background-image: url(http://img.webme.com/pic/a/akimkin/header123.png);
background-repeat: no-repeat;
border: 0px solid #000000; }
/* Titel im Header entfernen */
td.headline {visibility: hidden;}
/* Titel über Navigation */
td.nav_heading {
color: #62b1ff;
font-size: 0px;
font-family: arial,verdana;
text-align: center;
height: 29px;
background-color: #000000;
background-image: url(http://img.webme.com/pic/a/akimkin/slider123.jpg);
border: 0px solid #000000; }
/* Navi Buttons */
td.nav {
background-color: ;
background-image: url(http://img.webme.com/pic/a/akimkin/buttonnormal123.jpg);
border: 0px solid #000000; }
/* Hover Navi-Button */
td.nav:hover {
background-color: ;
background-image: url(http://img.webme.com/pic/a/akimkin/buttonhover12345.jpg);
border: 0px solid #000000; }
/* Textlinks in Navigation */
td.nav a {
color: #ffffff;
font-size: 14px;
font-family: arial,verdana;
text-decoration: none;
text-align: center; }
/* Hover Textlink Navigation */
td.nav a:hover{
color: #ffffff;}
/* aktuell besuchte Seite */
tr.checked_menu td {
background-color: #XXXXXX;
background-image: url(http://img.webme.com/pic/a/akimkin/buttonnormal123.jpg); }
/* Hover-Effekt löschen für aktuell besuchte Seite */
tr.checked_menu td:hover {
background-color: #XXXXXX;
background-image: url(http://img.webme.com/pic/a/akimkin/buttonhover12345.jpg); }
/* Bild unter Navigation entfernt */
td.edit_below_nav {display: none;}
/* Hintergrund Navigation */
td.edit_navi_headbg {
height: 50%;
background-color: #XXXXXX ;
background-image: url();
border: 0px solid #000000; }
/* Balken über Textfeld */
td.edit_content_top {
height: 29px;
background-color: #000000;
background-image: url(http://img.webme.com/pic/a/akimkin/slider123.jpg);
border: 0px solid #000000; }
/* Seitentitel über Textfeld */
td.headline2 {
color: #000000;
font-size:0px;
font-family: arial,verdana;
text-align: left; }
/* Textfeld */
td.edit_content {
padding-top: 15px;
padding-bottom: 15px;
background-color: #FFFFFF;
background-image: url();
border: 0px solid #000000; }
/* Linke Spalte im Textfeld */
td.edit_content_left_spacer {
background-color: #XXXXXX;
background-image: url(); }
/* Rechte Spalte im Textfeld */
td.edit_content_right_spacer {
background-color: #XXXXXX;
background-image: url(); }
/* Erste Balken unter Textfeld */
td.edit_content_bottom {
height: 29px;
background-color: #XXXXXX;
background-image: url();
border: 0px solid #000000; }
/* Zweiter Balken unter Textfeld (mit Counter) */
td.edit_content_bottom2 {
background-image:url(http://img.webme.com/pic/a/akimkin/slider123.jpg);
background-color: #XXxXXX; }
/* Counter / Besucherzähler */
td.edit_content_bottom2_counter {
font-family: arial,verdana;
color: #62b1ff;
font-size: 12px;
background-image: url(http://img.webme.com/pic/a/akimkin/slider123.jpg)
background-color: #XXXXXX;
border: 0px solid #000000; }
/* große Feld unter Textfeld */
td.edit_rechts_cbg {
height: 300px;
background-color: ;
background-image: url();
border: 0px solid #000000; }
/* Streifen rechts vom Design entfernt mit */
td.edit_rechts_sbg {display:none;}
/* Titel über rechter Box */
td.sidebar_heading {
color: #ffffff;
font-size: 14px;
font-family: arial,verdana ;
text-align: center;
height: 29px;
background-color: #41a77;
background-image: url(http://img.webme.com/pic/a/akimkin/slider123.jpg);
border: 0px solid #000000; }
/* rechte Boxen 1 bis 5 */
td.shouty, .shouty2, .shouty3, .shouty4, .shouty5 {
color: #000000;
font-size: 14px;
font-family: arial,verdana;
text-align: left;
background-color: #;
background-image: url();
background-repeat: repeat;
border: 0px solid #000000; }
/* Abschluß unter Boxen 1 bis 5 entfernt mit */
td.edit_rb_footer {
display:none;
}
/* Hintergrund unter rechten Boxen */
td.edit_rechts_bottom {
background-color: #XXXXXX;
background-image: url();
border: 0px solid #000000; }
--> </style> <!-- Nach dem </style> keine CSS-Codes mehr -->
</center>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//Execute the slideShow
slideShow();
});
function slideShow() {
//Set the opacity of all images to 0
$('#gallery a').css({opacity: 0.0});
//Get the first image and display it (set it to full opacity)
$('#gallery a:first').css({opacity: 1.0});
//Set the caption background to semi-transparent
$('#gallery .caption').css({opacity: 0.7});
//Resize the width of the caption according to the image width
$('#gallery .caption').css({width: $('#gallery a').find('img').css('width')});
//Get the caption of the first image from REL attribute and display it
$('#gallery .content').html($('#gallery a:first').find('img').attr('rel'))
.animate({opacity: 0.7}, 400);
//Bilderwechsel Zeit 3000 = 3 sekunden
setInterval('gallery()',3000);
}
function gallery() {
//if no IMGs have the show class, grab the first image
var current = ($('#gallery a.show')? $('#gallery a.show') : $('#gallery a:first'));
//Get next image, if it reached the end of the slideshow, rotate it back to the first image
var next = ((current.next().length) ? ((current.next().hasClass('caption'))? $('#gallery a:first') :current.next()) : $('#gallery a:first'));
//Get next image caption
var caption = next.find('img').attr('rel');
//Set the fade in effect for the next image, show class has higher z-index
next.css({opacity: 0.0})
.addClass('show')
.animate({opacity: 1.0}, 1000);
//Hide the current image
current.animate({opacity: 0.0}, 1000)
.removeClass('show');
//Set the opacity to 0 and height to 1px
$('#gallery .caption').animate({opacity: 0.0}, { queue:false, duration:0 }).animate({height: '1px'}, { queue:true, duration:300 });
//Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
$('#gallery .caption').animate({opacity: 0.7},100 ).animate({height: '50px'},500 );
//Display the content
$('#gallery .content').html(caption);
}
</script>
<style type="text/css">
<!--
.left{
float: left;
margin: 2px;
}
.right{
float: right;
margin: 2px;
}
-->
</style>
<style type="text/css">
<!--
td#nav_Abstand1{visibility:hidden;height:5px;}
td#nav_Abstand2{visibility:hidden;height:5px;}
td#nav_Abstand3{visibility:hidden;height:5px;}
td#nav_Abstand4{visibility:hidden;height:5px;}
-->
</style>
<style type="text/css">
<!--
td#nav_Abstand1{visibility:hidden;height:5px;}
td#nav_Abstand2{visibility:hidden;height:5px;}
td#nav_Abstand3{visibility:hidden;height:5px;}
td#nav_Abstand4{visibility:hidden;height:5px;}
-->
</style>
