Sayfa içerisinde Menü

15.06.2019 23:27

BakiKala Editör & Makale Hizmeti Kullanıcı

Üyelik 19.06.2018
Yaş/Cinsiyet 28 / E
Meslek Editör & Yazar
Konum Mersin

Ad Soyad B** K**
Mesajlar 339
Beğeniler 30 / 44
Ticaret 3, (%67)

Merhabalar.

Web sayfası içerisinde ayrıca menülü bir sayfa oluşturmak istiyorum.

Böyle bir stile benzer kodlar varsa editleyebilirim.

Tam olarak aradığım şey bu şekilde:

Şu tarz stillerin bir ismi varsa benzer tarzdada olabilir. Yardımcı olabilir misiz?

Hazır Makale Paketleri Satışı Yapılır. İsteğe göre makale yazılır. Anında Teslim Edilir.

15.06.2019 23:36

#2

carasar All ızz well... Kullanıcı

Üyelik 29.10.2016
Yaş/Cinsiyet 33 / E
Meslek Öğretmen
Konum Konya

Ad Soyad O** K**
Mesajlar 1116
Beğeniler 499 / 498
Ticaret 16, (%100)

Jquery ile yapabilirsiniz.

https://youtu.be/nkqmbRvUk-w

1 kişi bu mesajı beğendi.

15.06.2019 23:39

#3

BakiKala Editör & Makale Hizmeti Kullanıcı

Üyelik 19.06.2018
Yaş/Cinsiyet 28 / E
Meslek Editör & Yazar
Konum Mersin

Ad Soyad B** K**
Mesajlar 339
Beğeniler 30 / 44
Ticaret 3, (%67)

Teşekkür ederim :.

Hazır Makale Paketleri Satışı Yapılır. İsteğe göre makale yazılır. Anında Teslim Edilir.

16.06.2019 00:11

#4

BakiKala Editör & Makale Hizmeti Kullanıcı

Üyelik 19.06.2018
Yaş/Cinsiyet 28 / E
Meslek Editör & Yazar
Konum Mersin

Ad Soyad B** K**
Mesajlar 339
Beğeniler 30 / 44
Ticaret 3, (%67)

carasar adlı üyeden alıntı

Jquery ile yapabilirsiniz.

https://youtu.be/nkqmbRvUk-w

Hocam kodu düzenledim. dosyaları sitemin anadizinine attım div kodlarınıda ekleyeceğim sayfaya girdim. Js ve css dosyaları yüklenmiyor sanırım yazılar stilsiz görünüyor yardımcı olur musunuz?

Hazır Makale Paketleri Satışı Yapılır. İsteğe göre makale yazılır. Anında Teslim Edilir.

16.06.2019 12:25

#5

carasar All ızz well... Kullanıcı

Üyelik 29.10.2016
Yaş/Cinsiyet 33 / E
Meslek Öğretmen
Konum Konya

Ad Soyad O** K**
Mesajlar 1116
Beğeniler 499 / 498
Ticaret 16, (%100)

Bootstrap 3 kullanarak şu şekilde yapabilirsiniz.

HTML KODLARI

CSS KODLARI





.gallery-title

{

    font-size: 36px;

    color: #42B32F;

    text-align: center;

    font-weight: 500;

    margin-bottom: 70px;

}

.gallery-title:after {

    content: "";

    position: absolute;

    width: 7.5%;

    left: 46.5%;

    height: 45px;

    border-bottom: 1px solid #5e5e5e;

}

.filter-button

{

    font-size: 18px;

    border: 1px solid #42B32F;

    border-radius: 5px;

    text-align: center;

    color: #42B32F;

    margin-bottom: 30px;



}

.filter-button:hover

{

    font-size: 18px;

    border: 1px solid #42B32F;

    border-radius: 5px;

    text-align: center;

    color: #ffffff;

    background-color: #42B32F;



}

.btn-default:active .filter-button:active

{

    background-color: #42B32F;

    color: white;

}



.port-image

{

    width: 100%;

}



.gallery_product

{

    margin-bottom: 30px;

}

JS KODLARI





$(document).ready(function(){



    $(".filter-button").click(function(){

        var value = $(this).attr('data-filter');

        

        if(value == "all")

        {

            //$('.filter').removeClass('hidden');

            $('.filter').show('1000');

        }

        else

        {

//            $('.filter[filter-item="'+value+'"]').removeClass('hidden');

//            $(".filter").not('.filter[filter-item="'+value+'"]').addClass('hidden');

            $(".filter").not('.'+value).hide('3000');

            $('.filter').filter('.'+value).show('3000');

            

        }

    });

    

    if ($(".filter-button").removeClass("active")) {

$(this).removeClass("active");

}

$(this).addClass("active");



});

16.06.2019 13:42

#6

BakiKala Editör & Makale Hizmeti Kullanıcı

Üyelik 19.06.2018
Yaş/Cinsiyet 28 / E
Meslek Editör & Yazar
Konum Mersin

Ad Soyad B** K**
Mesajlar 339
Beğeniler 30 / 44
Ticaret 3, (%67)

carasar hocam gönderdiğiniz kodları ekledim. kod önizlemede yaptım aynı görüntü çıkıyor gönderdiğiniz galeri bu şekildemi yoksa bir terslik mi var?

Hazır Makale Paketleri Satışı Yapılır. İsteğe göre makale yazılır. Anında Teslim Edilir.

16.06.2019 14:07

#7

carasar All ızz well... Kullanıcı

Üyelik 29.10.2016
Yaş/Cinsiyet 33 / E
Meslek Öğretmen
Konum Konya

Ad Soyad O** K**
Mesajlar 1116
Beğeniler 499 / 498
Ticaret 16, (%100)

Bootrapt 3 versiyonunun js ve css kodlarını entegre edin. Yapi bozuk.

16.06.2019 14:21

#8

BakiKala Editör & Makale Hizmeti Kullanıcı

Üyelik 19.06.2018
Yaş/Cinsiyet 28 / E
Meslek Editör & Yazar
Konum Mersin

Ad Soyad B** K**
Mesajlar 339
Beğeniler 30 / 44
Ticaret 3, (%67)

carasar ne yaptıysam olmadı sitemde .js formatlı dosyalar çalışmıyor.

Hazır Makale Paketleri Satışı Yapılır. İsteğe göre makale yazılır. Anında Teslim Edilir.

16.06.2019 14:22

#9

carasar All ızz well... Kullanıcı

Üyelik 29.10.2016
Yaş/Cinsiyet 33 / E
Meslek Öğretmen
Konum Konya

Ad Soyad O** K**
Mesajlar 1116
Beğeniler 499 / 498
Ticaret 16, (%100)

jquery ekli değildir once önce onu ekleyin.

16.06.2019 14:24

#10

BakiKala Editör & Makale Hizmeti Kullanıcı

Üyelik 19.06.2018
Yaş/Cinsiyet 28 / E
Meslek Editör & Yazar
Konum Mersin

Ad Soyad B** K**
Mesajlar 339
Beğeniler 30 / 44
Ticaret 3, (%67)

.css kodlarını index.php içine kopyaladım. ardından /js/test.js diye bir dizin oluşturdum.
index head içerisine :