MyBB Depo Forum
Mybb Efektli Link Yapımı - Baskı Önizleme

+- MyBB Depo Forum (https://mybbdepo.com)
+-- Forum: Mybb Ders Deposu (https://mybbdepo.com/mybb-ders-deposu-forumu)
+--- Forum: Videolu Anlatım Deposu (https://mybbdepo.com/videolu-anlatim-deposu-forumu)
+--- Konu Başlığı: Mybb Efektli Link Yapımı (/mybb-efektli-link-yapimi-konusu.html)

Sayfalar: 1 2

Mybb Efektli Link Yapımı - usameavci - 15-04-2014

Merhaba arkadaşlar. Bayadır efektli link yapımı ile ilgili konular açılıyor. Bu gün boş zamanım vardı ve videolu anlatım yaptım. Mikrofon olmadığı için yazılı olarak anlattım. Mikrofon aldığımda sesli oalrak da anlatımlar yapacağım.

Videoda kullandığım bazı kodları ve site adreslerini buraya ekleyeceğim. Sizlerden ricam hazır kod diye al - kullan - geç yapmamanız. Ben bu videoyu öğrenmeniz için hazırladım. Önce videoyu izleyin ve nasıl yapıldığına bir bakın. Yaptıklarımı anladığınızda kodlara ihtiyaç duyacağınızı sanmıyorum fakat yinede yapamadıysanız kodları kullanın.
Kodlar ve Siteler videonun altındadır.





Vimeo'dan İzle

Efektlerin bulunduğu site:
Kod:
http://tympanus.net/codrops/2013/08/06/creative-link-effects/
Şekillerin bulunduğu site:
Kod:
http://www.nasil.gen.tr/ozel-isaretler-nasil-yapilir.html#bolum12

CSS Kodları:
Kod:
.trow1 a::before,
.trow1 a::after {
    display: inline-block;
    opacity: 0;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
    -moz-transition: -moz-transform 0.3s, opacity 0.2s;
    transition: transform 0.3s, opacity 0.2s;
}

.trow1 a::before {
    margin-right: 5px;
    content: '◤';
    -webkit-transform: translateX(20px);
    -moz-transform: translateX(20px);
    transform: translateX(20px);
}

.trow1 a::after {
    margin-left: 5px;
    content: '◢';
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    transform: translateX(-20px);
}

.trow1 a:hover::before,
.trow1 a:hover::after,
.trow1 a:focus::before,
.trow1 a:focus::after {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translateX(0px);
}
.trow2 a::before,
.trow2 a::after {
    display: inline-block;
    opacity: 0;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
    -moz-transition: -moz-transform 0.3s, opacity 0.2s;
    transition: transform 0.3s, opacity 0.2s;
}

.trow2 a::before {
    margin-right: 10px;
    content: '◤';
    -webkit-transform: translateX(20px);
    -moz-transform: translateX(20px);
    transform: translateX(20px);
}

.trow2 a::after {
    margin-left: 10px;
    content: '◢';
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    transform: translateX(-20px);
}

.trow2 a:hover::before,
.trow2 a:hover::after,
.trow2 a:focus::before,
.trow2 a:focus::after {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translateX(0px);
}

Kaynak belirtmek şartı ile paylaşım serbesttir. İyi forumlar Melek - Masum

Cvp: Mybb Efektli Link Yapımı - Screwy - 15-04-2014

Eline sağlık hocam. Güzel konu Gülümseme
Bu arada işletim sistemin nedir? Birde o arkaplanı istiyorum Açık Ağızlı Gülümseme

Cvp: Mybb Efektli Link Yapımı - usameavci - 15-04-2014

(15-04-2014, Saat:22:05)Screwy Adlı Kullanıcıdan Alıntı: Eline sağlık hocam. Güzel konu Gülümseme
Bu arada işletim sistemin nedir? Birde o arkaplanı istiyorum Açık Ağızlı Gülümseme

İşletim sistemi win 7 arkaplanı videoyu çekmeden Önce yaptım Açık Ağızlı Gülümseme PSD atarım pm'den Melek - Masum

Win7 teası için
Kod:
http://skinpacks.com/
bu siteye bakabilirsin. Baya iyi şeyler var ^^

Cvp: Mybb Efektli Link Yapımı - MelihAtasever - 15-04-2014

elinize emeğinize sağlık hocam gene süpersiniz Gülümseme

Cvp: Mybb Efektli Link Yapımı - tsunami - 15-04-2014

Güzel konu olmuş. Bazı görsel uygulamaları birilerinin tekelinden kurtarmak güzel birşey.. Sanki kendileri kodlamış gibi göstermesi insanı sinir ediyor. Bu arada malum site hemen cezanı kesmiş, demek ki devamlı burayı dikisliyorlarmış..

Cvp: Mybb Efektli Link Yapımı - usameavci - 16-04-2014

Yorumlarınız için sağolun arkadaşlar. Ben buralarda oldukça o tekellerin hepsini elimden geldikçe dağıtacağım Gülümseme ( Hukuki sınırlar içerisinde Dil Çıkarma ) O forumdan biri daha önce sormuştu pm ile siteyi falan göstermiştim. O ara uyarı seviyem 100% oldu. Dün de zorlarına gitmiş banlamışlar ^^ Eğer sağda solda gördüğünüz kullanışlı şeyler varsa mail yada pm atın boş olduğum zamanlarda butarz anlatımlar yapmayı planlıyorum. Kısmetse 2. Videomda sıfırdan portal yapımını anlatacağım. Fakat php bilgisi olmayanlar için sıkıntılı olabilir Melek - Masum

Cvp: Mybb Efektli Link Yapımı - panelink - 16-04-2014

elıne saglık guzel anlatım olmus emegının karsılıgnı verırler umarım

Cvp: Mybb Efektli Link Yapımı - Emektar - 16-04-2014

Hocam çok teşekkürler elinize emeğinize sağlık. Süper