ürün detay-incele butonu mause resmin üzerne gelince açılıyor---yardım lütfen

s_bugra · 22 Tem 2012

css ile o kadar uğraştım hazırladığım incele.png ürün resminin arkasında kalıyor. "hover" özelliği ile yapmaya çalıştım olmadı.

bu sitedeki gibi olsun istiyorum:
http://www.privateshoppingscript.com/erkek/gomlek

resmin üzerine gelince ürün detayları yazısı çıkıyor.

bir de bu site var bu daha çok hoşuma gitti ama zor görünüyor
http://www.universiteavm.com/

lütfen css anlayan biri yardım etsin.

merdobul · 8 Ağu 2012

Bende böyle bir şeyler yapmak istiyorum açıkçası bu konu ile ilgili lütfen yardım edin. Şimdiden teşekkürler...

valuerock · 8 Ağu 2012

asagidaki kodlardan bakip kendinize göre düzenleyebilirsiniz.

Kod:

<html>
<head>
<style type="text/css">
ul.hover_block li{
list-style:none;
float:left;
background: #fff;
padding: 10px;
width:300px; position: relative;
margin-right: 20px; }

ul.hover_block li a {
display: block;
position: relative;
overflow: hidden;
height: 150px;
width: 268px;
padding: 16px;
color: #000;
font: 1.6em/1.3 Helvetica, Arial, sans-serif;
}

ul.hover_block li a { text-decoration: none; }

ul.hover_block li img {
position: absolute;
top: 0;
left: 0;
border: 0;
}

</style>
<script type="text/javascript" src="jquery.js">
</script>
<script type="text/javascript">
$(function() {
$('ul.hover_block li').hover(function(){
$(this).find('img').animate({top:'182px'},{queue:false,duration:500});
}, function(){
$(this).find('img').animate({top:'0px'},{queue:false,duration:500});
});
});
</script>
</head>
<body>

<ul>
<li><a href="/"><img src="image01.gif" alt="alt" /> This is sample Text1 </a></li>
<li><a href="/"><img src="image02.gif" alt="alt" /> This is sample Text2 </a></li>
</ul>
</body>
</html>

ccuma · 14 Eyl 2012

tam olarak nasıl yapıcaz ? biraz açıklarmısınız neyi nereye eklicez ?

mbkilimci · 4 Eyl 2014

bu kod hangi dosyada bilgi verebilirmisiniz ?

ürün detay-incele butonu mause resmin üzerne gelince açılıyor---yardım lütfen

s_bugra

OpenCart-TR

merdobul

OpenCart-TR

valuerock

OpenCart-TR

ccuma

OpenCart-TR

mbkilimci

OpenCart-TR