Opencart Türkiye Destek Sitesi ,E-Ticaret Yazılımı Destek Paylaşım Forumu

e-ticaretdersleri Tüm Mesajlarını Bul · Konu Tarihi: **09-08-2012 12:57 AM**

Herkese iyi akşamlar. Jquery door eklentisini opencart için uyarladım. Genel olara mouse resmin üzerine gelince yukarı doğru panel açılmakta ver ürün adı fiyat sepete at gibi deyimler burada göstermektedir. Fikir sahibi @Fatih abime teşekkür ederim.

Not : Hata Alan arkadaşlar olursa bu default temaya göre uyarlanmıştır kendi tpl dosyamı ekte veriyorum siz kendinize göre uyararsınız java script dosyasını catalog/view/javascript klasörüne atınız

Kurulumu :

Açınız : catalog/view/theme/default/stylesheet stylesheet.css

Sayfanın En Altına Ekleyiniz :

PHP Kod:

.eff {
    
    /* the image size is 126x126, it's adjusted to fit the border as well*/
    width:136px;
    height:136px;

    /* important, allow the children object to move inside its parent obj */
    position:relative;    

    /* important, it hides the moved image */
    overflow:hidden;
    
    /* with the clear class, make it into 3 x 3 layout */
    float:left;
    
    /* IE float bug fix */
    display:inline;
    
    /* styling */
    margin:8px;
    font-size:12px;
}

.eff img {
    display:block;
    width:126px;
    height:126px;
    
    /* styling */
    text-decoration:none;
    border:4px solid #ccc;
    background:#ddd;

    /* important, it allows this obj to move by jquery */
    position:absolute;
    
    /* make sure it appears above the caption */
    z-index:500;
    
    cursor:pointer; cursor:hand;
}


.eff .caption {
    /* should be the same size with the image */
    width:126px;
    height:126px;
    
    /* styling */
    background:#333;
    border:4px solid #ccc;
    color:#eee;
    
    /* set the position to 0, 0 and appear under the image */
    position:absolute;
    top:0; left:0;
    z-index:0;
}


/* extra styling*/

.eff .caption a.header {
    margin:10px 5px 5px 5px;
    display:block;
    font-size:14px;    
    font-weight:700;
    color:#4ed7f4;
}

.eff .caption p {
    margin:5px;    
} 

Dosyamızı Açalım :

Açınız : catalog/view/theme/default/template/module latest.tpl

Bulalım :

PHP Kod:

<div class="box"> 

Üstüne Ekleyelim :

PHP Kod:

<script type="text/javascript" src="catalog/view/javascript/jquery.easing.1.3.js"></script>

<script>

$(document).ready(function() {

    //if mouse over and mouse out
    $('.eff').hover(
    function () {

        value = $(this).find('img').outerHeight() * -1;

        //for left/right if you have different width and height, 
        //commented out because we are using up/down in this example
        //value = $(this).find('img').outerWidth() * -1); 
        
        //animate the image
        // you can change the sliding direction by changing bottom to left, right or top
        // if you changed this, you will have to change the position of the hover out as well
        $(this).find('img').stop().animate({bottom: value} ,{duration:500, easing: 'easeOutBounce'});    
        
    },
    function () {
        
        //reset the image
        // the position property (bottom), it must be same with the on in the mouseover
        $(this).find('img').stop().animate({bottom:0} ,{duration:500, easing: 'easeOutBounce'});    
    
    });
    
    //if user clicked on the thumbnail
    $('.eff').click(function () {    
        //grab and execute the first link in the thumbnail
        window.location = $(this).find('a:first').attr('href');
    });
    
});

</script> 

Gene Aynı Dosyada Bulalım :

PHP Kod:

<div class="name">
                <?php if (strlen($product['name']) > '17') { ?>
                    <a href="<?php echo $product['href']; ?>" title="<?php echo $product['name']; ?>"><?php echo substr($product['name'], 0, 17).".."; ?></a></div>
                <?php } else { ?>
                    <a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></div>
                <?php } ?>
        <?php if ($product['price']) { ?>
        <div class="price">
          <?php if (!$product['special']) { ?>
          <?php echo $product['price']; ?>
          <?php } else { ?>
          <span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
          <?php } ?>
        </div>
        <?php } ?>

Değiştirelim :

PHP Kod:

<div class="image"><div class="eff"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /><div class="caption"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a><p> <?php if ($product['price']) { ?>
        
          <?php if (!$product['special']) { ?>
          <?php echo $product['price']; ?>
          <?php } else { ?>
          <s><?php echo $product['price']; ?></s> <b><?php echo $product['special']; ?></b>
          <?php } ?>
       
        <?php } ?><?php if ($product['price']) { ?>
        <div class="price">
          <?php if (!$product['special']) { ?>
          <?php echo $product['price']; ?>
          <?php } else { ?>
          <span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
          <?php } ?>
        </div></br> <div class="cart"><a onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button"><span><?php echo $button_cart; ?></span></a></p></div></div>

</a></div></div>       
        <?php } ?>
        
        
        <?php } ?>

nokta Tüm Mesajlarını Bul · Konu Tarihi: **09-08-2012 10:19 AM**

@kiıoğlumarket @Fatih emeklerinize sağlık.
uzun zaman önce bu düzenlemeyi bir temadan ayırmak için epeyce zaman harcamıştım.
Çok hoş görünüm veren bir düzenleme.

thuna Tüm Mesajlarını Bul · Konu Tarihi: **11-01-2012 02:50 PM**

cok tesekkur ederim hemen hemen aradıgım sey bu ancak hem altta hemde uzerıne gelınce hemde altta sepete ekle butonu var ben alttakı butonu nasıl kaldırabılırım?
ve kucuk bır sorun daha var admın panelınden resımlerın boyutunu buyutunce yanı 80x80
daha buyuk yapınca anasayfadakı urun resımlerı bırbırıne gecıyor bu sorunu nasıl gıderebılırım? sımdıden tesekkur ederım..

ITECHINN Tüm Mesajlarını Bul · Konu Tarihi: **11-01-2012 03:56 PM**

(11-01-2012 02:50 PM)thuna Yazılan: cok tesekkur ederim hemen hemen aradıgım sey bu ancak hem altta hemde uzerıne gelınce hemde altta sepete ekle butonu var ben alttakı butonu nasıl kaldırabılırım?
ve kucuk bır sorun daha var admın panelınden resımlerın boyutunu buyutunce yanı 80x80
daha buyuk yapınca anasayfadakı urun resımlerı bırbırıne gecıyor bu sorunu nasıl gıderebılırım? sımdıden tesekkur ederım..

Selamlar,

Sorununuzu CSS ile biraz oynamalar yaparak düzeltebilirsiniz.

Butonu ise

PHP Kod:

<div class="cart"><a onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button"><span><?php echo $button_cart; ?></span></a></p></div> 

kodunu silerek kaldırabilirsiniz.

Hatırlatma;

Aynı mesajı 2 konuya birden yazmak çözümü hızlandırmaz Smile


Direk Link
HTML Link
BBCode Link
Sosyal Paylaş	Sabah net google facebook digg twiter yahoo mixx stumbleupon delicious reddit myspace friendfeed google buzz linkedin

Benzeyen Konular
Konu:		Yazar	Cevaplar:	Gösterim:	Son Mesaj
	[Mod] Siparişinizi Tamamlama İçin X Tl Ve Üzeri Eklentisi	e-ticaretdersleri	18	9,107	06-09-2015 12:12 PM Son Mesaj: turkojen34
	Opencart 1.5.x Sepete Ekle Kasaya git eklentisi (vqmod)	osdem66	19	16,148	01-22-2015 10:34 AM Son Mesaj: erne
	Ürün Detay Sayfasında beni ara eklentisi biraz gelişmiş versiyon. kendi yapımımdır.	kazakcii	10	7,338	12-16-2014 01:04 PM Son Mesaj: trayn
	[Modifikasyon] Lightbox Olarak Kayıt Ve Giriş Eklentisi Vqmod	e-ticaretdersleri	8	5,066	11-28-2014 11:49 PM Son Mesaj: webimyum
	[Mod] opencart kendi sitemap eklentisi	sualci	0	1,767	11-13-2014 02:17 PM Son Mesaj: sualci
	[Eklenti] TC Doğrulama Eklentisi	sunaycetin	1	3,835	10-24-2014 07:47 PM Son Mesaj: Gökhan TAYLAN
	Pop up sepet Eklentisi 1.5.2.xve üstü versiyonlar için	osdem66	54	30,918	10-15-2014 02:48 PM Son Mesaj: erkanixi
	Marka Eklentisi Çalışmıyor.	sanalx	2	2,694	06-10-2014 03:05 PM Son Mesaj: sanalx
	[Mod] Proticaret Tarzı tab Eklentisi- Fixed	e-ticaretdersleri	9	6,723	05-19-2014 09:19 PM Son Mesaj: e-ticaretdersleri
	Kategori Sayfasında Marka Filtreleme Eklentisi	e-ticaretdersleri	9	6,594	01-20-2014 03:32 PM Son Mesaj: ewrah07

	Şuanki Zaman: 12-19-2024, 03:47 PMHoşgeldin Misafir !
	Beni Hatırla Şifremi Hatırlat

« Önceki \| Sonraki »

Opencart Türkiye Destek Sitesi ,E-Ticaret Yazılımı Destek Paylaşım Forumu

Modül Jqurey Door Eklentisi