Hallo erst einmal und ein dickes Lob an alle, die sich hier soviel Mühe machen und ihre Tipps weiter geben. Hat mir wirklich sehr weiter geholfen.
Allerdings hätte ich dennoch ein kleines Problem mit dem Slider.
http://heine-elektronik.de/modified eCommerce Shopsoftware-1.05-SP1b/Hier mal die Seite.
Und zwar hätte ich gern das die Artikel mehr in der Mitte sind und nicht soweit oben und ich bekomme es einfach nicht hin das der Text mittig unter dem Artikelbild ist. Zudem würde ich gern ein "mouseover" bei den Pfeilen erstellen.
Was müsste ich dafür tun?
treadmill.css/* products_treadmill.html - Products-Treadmill (c)2008 by Hetfield - www.MerZ-IT-SerVice.de - Begin */
.treadmill_prev {
width:32px;
height:207px;
float:left;
text-align:right;
}
button.treadmill_prev {
background:url(../img/prev.png) center no-repeat;
border:0;
vertical-align:middle;
}
.treadmill_next {
width:32px;
height:207px;
float:right;
text-align:left;
}
button.treadmill_next {
background:url(../img/next.png) center no-repeat;
border:0;
vertical-align:middle;
}
div#products_treadmill {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:0.8em;
background-image:url(../img/slider_bg.jpg);
height:207px;
width:100px;
margin:0 auto;
padding:0px 50px 0px 50px;
text-align:center;
display:block;
text-decoration:none;
}
div#products_treadmill ul { width:100px; height:250px; text-align:center;}
div#products_treadmill ul li { width:200px; height:250px; list-style:none; text-align:center;}
div#products_treadmill a.textlink:link { color:#EDEDED; text-align:center;}
div#products_treadmill a.textlink:visited { color:#EDEDED; text-align:center;}
div#products_treadmill a.textlink:hover { color:#555; text-align:center;}
div#products_treadmill a.textlink:active { color:#EDEDED; text-align:center;}
div#products_treadmill a.textlink:focus { color:#EDEDED; text-align:center;}
div#products_treadmill img { display:block; }
/* products_treadmill.html - Products-Treadmill (c)2008 by Hetfield - www.MerZ-IT-SerVice.de - End */
products_treadmill.html<div class="treadmill_prev">
<button class="treadmill_prev"> </button>
</div>
<div class="treadmill_next">
<button class="treadmill_next"> </button>
</div>
<div id="products_treadmill">
<ul>
{foreach name=aussen item=treadmill_data from=$treadmill_content}
<li>{if $treadmill_data.PRODUCTS_IMAGE}<a href="{$treadmill_data.PRODUCTS_LINK}" title="{$treadmill_data.PRODUCTS_NAME}"><img src="{$treadmill_data.PRODUCTS_IMAGE}" alt="{$treadmill_data.PRODUCTS_NAME}" /></a>
{else}<a href="{$treadmill_data.PRODUCTS_LINK}" title="{$treadmill_data.PRODUCTS_NAME}"><img src="{$tpl_path}img/{$language}/no_image.gif" alt="{$treadmill_data.PRODUCTS_NAME}" /></a>
{/if}
<p><a href="{$treadmill_data.PRODUCTS_LINK}" class="textlink">{$treadmill_data.PRODUCTS_NAME}</a></p>
</li>
{/foreach}
</ul>
</div>
<div style="clear:both"></div>
products_treadmill.js $(function() {
$("#products_treadmill").jCarouselLite({
easing: "swing",
visible: 4,
auto: 2000,
speed: 1000,
btnNext: ".treadmill_next", btnPrev: ".treadmill_prev", mouseWheel: true
});
});
Wäre echt dankbar für eure Hilfe.
Mit freundlichen Grüßen
Jan Heine
