Teknik Elektrik

JavaScript Combobox Menü Yapımı

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdZhuUUaoiURTZiVkRQu_35auu6e1iiiQWI9y2zCOjVd9VOGhlyblFn-j7Vt8_gEFURSbQ6lWQNzyuA4vL9BNmQAvBG-x2s1mFQoAKkfHx5T6co75-8I59NtNKolDOQyugWVAvI0LD26w/s1600/anigif.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdZhuUUaoiURTZiVkRQu_35auu6e1iiiQWI9y2zCOjVd9VOGhlyblFn-j7Vt8_gEFURSbQ6lWQNzyuA4vL9BNmQAvBG-x2s1mFQoAKkfHx5T6co75-8I59NtNKolDOQyugWVAvI0LD26w/s1600/anigif.gif" /></a></div>
<br />
                                          <span style="font-family: Georgia, Times New Roman, serif;">  Blogger sitenizde gadget olarakda kullanabilirsiniz.</span><br />
<div style="text-align: center;">
<span style="font-family: Georgia, Times New Roman, serif;">             Yada yazılarınız içinde kullanabilirsiniz bu size kalmış.</span></div>
       <b> Kodlar;</b><br />
<pre style="background-color: whitesmoke; border-left-color: rgb(185, 211, 238); border-left-style: double; border-left-width: 6px; font-family: 'Andale Mono', 'Lucida Console', Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;"><code><span style="color: #888888;"><SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
<FORM NAME="form">
<SELECT NAME="site" size=1 onChange_fckprotectedatt=" onChange="javascript:jumpBox()"">
<OPTION VALUE="</span><span style="color: blue;">http://etralibela-61.blogspot.com/</span><span style="color: #888888;">"></span><span style="color: red;">Menü</span><span style="color: #888888;">
<OPTION VALUE="</span><span style="color: blue;">https://www.facebook.com/BilgiCafem61</span><span style="color: #888888;">"></span><span style="color: red;">Facebook</span><span style="color: #888888;">
<OPTION VALUE="</span><span style="color: blue;">http://www.youtube.com/user/TheAlper061</span><span style="color: #888888;">"></span><span style="color: red;">Youtube</span><span style="color: #888888;">
</SELECT>
</FORM></span></code><span style="color: #888888;">
</span></pre>
<b><br />
</b> <br />
<b>         Combobox Menü Görünümü;</b><br />
<b><br />
<script language="JavaScript">
<br />
<form name="form">
<b><select javascript:jumpbox="" name="site" onchange_fckprotectedatt=" onChange=" size="1"> <option value="http://etralibela-61.blogspot.com/">Menü </option><option value="https://www.facebook.com/BilgiCafem61">Facebook </option><option value="http://www.youtube.com/user/TheAlper061">Youtube </option></select></b></form>
        <br />
<i style="color: red; font-size: x-large;">     </i><br />
<b><span style="font-family: Georgia, Times New Roman, serif;"><br />
</span></b> <b><span style="font-family: Georgia, Times New Roman, serif;"><br />
</span></b> <b><span style="font-family: Georgia, Times New Roman, serif;"><br />
</span></b> <b><span style="font-family: Georgia, Times New Roman, serif;"><br />
</span></b> <b><span style="font-family: Georgia, Times New Roman, serif;">             Kod İçinde Düzenlenlenmesi Gereken Bölümler;</span></b><br />
<span style="color: red; font-size: large;"><i><br />
</i></span> <span style="color: red; font-size: large; font-style: italic;">  </span><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: red;">Kırmızı </span>yazılı metin bölümlerine istediğiniz başlıkları ekleyebilirsiniz.</span><br />
<span style="font-family: Georgia, Times New Roman, serif;">  <span style="color: blue;">Mavi</span> yazılı metin bölümlerine ise başlık eklediğiniz metine göre linki eklenecek bölümdür.</span><br />
<div>
<br /></div>
<span style="color: red; font-size: large;"><i><br />
</i></span> <br />
<span style="color: red;"><i>Bizi Takip Edin</i></span><br />
<i><a href="http://http//www.dailymotion.com/Alper_Kaba_2#video=xzf06l/" target="_blank">Pinterest</a> <a href="https://www.facebook.com/trabzonlu.belaa" target="_blank">Facebook</a> <a href="https://twitter.com/kaba_mustafa" target="_blank">Twitter</a></i><br />
<span style="font-size: xx-small;"></span> <span style="color: #cccccc; font-size: xx-small;">© by <a href="http://etralibela-61.blogspot.com/" target="_blank">bilgicafem61</a></span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><i>Aşağıda Yorum ve Sorularınızı Bırakın. </i></span><br />
  <br />
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_preferred_1" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_2" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_3" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_4" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_compact" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_counter addthis_bubble_style" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> </div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script> <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-51dbf8420e77f7e8" type="text/javascript"></script>  <br />
<div id="fb-root">
</div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>  <br />
<div class="fb-like" data-href="http://etralibela-61.blogspot.com/" data-send="true" data-show-faces="true" data-width="350">
</div>

JavaScript Combobox Menü Yapımı

Blogger sitenizde gadget olarakda kullanabilirsiniz. Yada yazılarınız içinde ...

Devamı »

Blogger İçin JavaScript Scrollbar Butonları

<div dir="ltr" style="text-align: left;" trbidi="on">
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2dNu5ODR3hJiO2YSV-1r0_G6ISNp5ipwpcfTm53VXMg-J9ayDvMmvt7STkiVl2hgWqIVnLUeqskT1mib1jIyd2O8dexU21AlmE-qQ8ZNqCiro5IL-iegNzpMN5LVUgexYu7igJF_PXHw/s1600/javascript-web-tasarim-ve-programlama.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2dNu5ODR3hJiO2YSV-1r0_G6ISNp5ipwpcfTm53VXMg-J9ayDvMmvt7STkiVl2hgWqIVnLUeqskT1mib1jIyd2O8dexU21AlmE-qQ8ZNqCiro5IL-iegNzpMN5LVUgexYu7igJF_PXHw/s1600/javascript-web-tasarim-ve-programlama.png" /></a></div>
<br />
        <span style="font-family: Georgia, Times New Roman, serif;">Blogger Sitenizde VEYA, wordpress, internet sitelerinizde FAZLA buton kullanmak gerektiği zamanlarda goruntu çirkinliğini ortadan kaldırmak Click VEYA hazırlamış Olduğunuz yazı icinde BİRDEN FAZLA butonu kullanmanıza ihtiyacınız Olduğunda met tam boyut gore,</span><br />
<span style="font-family: Georgia, Times New Roman, serif;">         Blogger Sitenizde rahatlıkla uygulayabileceğiz, VEYA blogger Sitenizde Gadget olarakda kullanabilirsizin.</span><br />
<div style="margin-top: 5px; margin: 20px;">
<div class="quotetitle">
<b>ScrollBar Buton Görüntüsü;</b><br />
<br />
<br />
<html><br />
<head><br />
<title>Bilgi Cafem 61</title><br />
</head><br />
<br />
<body><br />
<script language="JavaScript">
var n = 1
var nn = 2
var nnn = 3
var nnnn = 4 /*Add more variables if you want more buttons showing, or take
them off if you want less. Remember to change the rest of the script
accordingly if you do this, as well as the <input> tags in the HTML.*/
var theMessages = new Array(7); {
theMessages[1] = "This could lead to your Page one."
theMessages[2] = "This could lead to your Page two."
theMessages[3] = "This could lead to your Page three."
theMessages[4] = "This could lead to your Page four."
theMessages[5] = "This could lead to your Page five."
theMessages[6] = "This could lead to your Page six."
theMessages[7] = "This could lead to your Page seven." /*You don't have to have this array unless you still want alert boxes appearing when the buttons are clicked.*/
}
var theValues = new Array(7); {
theValues[1] = "Buton 1"
theValues[2] = "Buton 2"
theValues[3] = "Buton 3"
theValues[4] = "Buton 4"
theValues[5] = "Buton 5"
theValues[6] = "Buton 6"
theValues[7] = "Buton 7" } //add more values and/or change them for your liking. 
function goup() {
if(n > 1){n = n-1
nn = nn-1
nnn = nnn-1
nnnn = nnnn-1 
//If you've changed the amount of buttons showing, add your extra variables - 1 here.
update()}}
function godown() {
if(nnnn < 7) { //Change the 7 if you want more buttons
n++
nn++
nnn++
nnnn++ 
/*Add your extra variables, with a '++' right after them here, if you've
changed the amount of buttons showing.*/
update()}
else{}}
//You could do 'window.location.href="whatever.html"' insted of the current alert boxes.
function go1() {
alert(cap1)}
function go2() {
alert(cap2)}
function go3() {
alert(cap3)}
function go4() {
alert(cap4)}
function update() {
document.form1.b1.value = theValues[n]
document.form1.b2.value = theValues[nn]
document.form1.b3.value = theValues[nnn]
document.form1.b4.value = theValues[nnnn]
cap1 = theMessages[n]
cap2 = theMessages[nn]
cap3 = theMessages[nnn]
cap4 = theMessages[nnnn]}

//</script></body></html> 
</div>
</div>
</div>
<br />
--><br />
<body onload="update()"><br />
<center>
<h1>
Bilgi Cafem 61</h1>
</center>
<form name="form1">
<input name="up" onclick="goup()" type="button" value="  ^  " /><br />
<br />
<input name="b1" onclick="go1()" type="button" value="Link To Page One  " /><br />
<br />
<input name="b2" onclick="go2()" type="button" value="Link To Page Two  " /><br />
<br />
<input name="b3" onclick="go3()" type="button" value="Link To Page Three" /><br />
<br />
<input name="b4" onclick="go4()" type="button" value="Link To Page Four " /><br />
<br />
<!-- If you add extra buttons here, insert them just above this comment.
You must add extra functions in the script too, presumably called go5()
etc.. </form>
</body><br />
<input name=""down"" onclick=""godown()"" quot="" type=""button"" v="" value=""" /><br />
<br />

<hr />
--><br /><br />
<br />
      <span style="font-family: Georgia, Times New Roman, serif;">Kodlar;</span><br />
<pre style="background-color: #eeeeee; border: 1px dashed rgb(153, 153, 153); font-family: 'Andale Mono', 'Lucida Console', Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;"><code>& Lt;! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd">

& Lt; html & gt;
& Lt; head & gt;
  & Lt; title & gt; <span style="color: red;">Bilgi Cafem 61</span> & lt; / title & gt;
& Lt; / head & gt;

& Lt; body & gt;
& Lt; script language = "JavaScript" & gt;
var n = 1
var nn = 2
var nnn = 3
var nnnn = 4 / * Eğer daha fazla düğmeleri gösteren istiyorsanız daha fazla değişkenleri ekleyin, ya da almak
Onları rahatsız daha az istiyorum. Yazısının geri kalanını değiştirmek unutmayın
GİRİŞ & gt; buna göre, yanı sıra & lt bunu yaparsanız; HTML etiketleri. * /
var theMessages = new Array (7); {
theMessages [1] = " <span style="color: blue;">Bu Sayfada bir yol olabilir.</span> "
theMessages [2] "= <span style="color: blue;">Bu Sayfada iki yol açabilir.</span> "
theMessages [3] "= <span style="color: blue;">Bu Sayfada üç yol açabilir.</span> "
theMessages [4] "= <span style="color: blue;">Bu Sayfada dört yol açabilir.</span> "
theMessages [5] "= <span style="color: blue;">Bu Sayfada beş yol açabilir.</span> "
theMessages [6] "= <span style="color: blue;">Bu Sayfada altı yol açabilir.</span> "
theMessages [7] "Bu Sayfada yedi yol açabilir." = / * Eğer hala düğmeler tıklandığında görünen uyarı kutularını istediğiniz sürece bu dizi olması gerekmez. * /
}
var theValues = new Array (7); {
theValues [1] = " <span style="color: orange;">Buton 1</span> "
theValues [2] = " <span style="color: orange;">Buton 2</span> "
theValues [3] = " <span style="color: orange;">Buton 3</span> "
theValues [4] = " <span style="color: orange;">Buton 4</span> "
theValues [5] = " <span style="color: orange;">Buton 5</span> "
theValues [6] = " <span style="color: orange;">Buton 6</span> "
theValues [7] = " <span style="color: orange;">Buton 7</span> "} daha fazla değer eklemek ve / veya sizin beğeninize için onları değiştirmek //.
fonksiyonu goup () {
Eğer (n ^ 1) {n = n-1
nn = nn-1
nnn = nnn-1
nnnn = nnnn-1 
Eğer gösteren düğmelerin miktarını değiştirdi ettiyseniz //, sizin ekstra değişkenler eklemek 1 - burada.
update ()}}
fonksiyonu Godown () {
if (nnnn & lt; 7) daha fazla düğme isterseniz {7 değiştirin //
n ++
nn ++
nnn ++
nnnn ++ 
Eğer yasiyorsaniz / * bir '++' hemen buraya sonra ile ekstra değişkenleri ekleyin,
düğmeleri gösteren miktarını değiştirdi. * /
update ()}
else {}}
// Sen 'window.location.href = "whatever.html"' yapabileceği cari uyarı kutuları insted.
fonksiyonu go1 () {
alert (cap1)}
fonksiyonu Go2 () {
alert (CAP2)}
fonksiyonu GO3 () {
alert (CAP3)}
fonksiyonu GO4 () {
alert (CAP4)}
fonksiyonu update () {
document.form1.b1.value = theValues [n]
document.form1.b2.value = theValues [nn]
document.form1.b3.value = theValues [nnn]
document.form1.b4.value = theValues [nnnn]
cap1 = theMessages [n]
CAP2 = theMessages [nn]
CAP3 = theMessages [nnn]
CAP4 = theMessages [nnnn]}

// - & Gt; 
& Lt; / script & gt;
& Lt; / head & gt;
& Lt; body onload = "update ()" & gt;
& Lt; merkezi & gt; & lt; h1 & gt; <span style="color: red;">Bilgi Cafem 61</span> & lt; / h1 & gt; & lt; / center & gt;
& Lt; form = "form1" & gt isim;
& Lt; input type = düğme name = value = "^" onclick = "goup ()" ve gt "yukarı"; & lt; br & gt;
& Lt; input type = düğme name = "b1" value = "Sayfa One link" onclick = "go1 ()" & gt; & lt; br & gt;
& Lt; input type = düğme name = "b2" value = "Sayfa İki link" onclick = "Go2 ()" & gt; & lt; br & gt;
& Lt; input type = düğme name = "b3" value = onclick = "GO3 ()" & gt "Sayfa Üçlüsü link"; & lt; br & gt;
& Lt; input type = düğme name = "b4" value = onclick = "GO4 ()" & gt "Sayfa Four link"; & lt; br & gt;
& Lt; -! Burada ekstra düğmeleri eklerseniz, sadece bu yorumun yukarıda takın.
Sen) (çok komut muhtemelen denilen GO5 ekstra fonksiyonlar eklemeniz gerekir
vs .. - & gt;
& Lt; input type = düğme name = "aşağı" value = "v" onclick = "Godown ()" & gt;
& Lt; / formu & gt; & lt hr & gt;

& Lt; / body & gt;
& Lt; / html & gt;
</code></pre>
<span style="color: red; font-size: large;"><i><br /></i></span>
     <b> <span style="font-family: Georgia, Times New Roman, serif;"> Kod İçinde duzenlenecek Olan Bölümler;</span></b><br />
<span style="font-family: Georgia, Times New Roman, serif;"> <span style="color: red;">Kırmızı</span> metin satın aldılar siz istediginiz Başlığı YAZIN.</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><span style="color: blue;"> Mavi</span> renkle belirtilmeiş metinlerin satın aldılar butonlara tıklandığında gösterilecek metin VEYA sayfa linkini ekleyın</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"> <span style="color: orange;">Turuncu</span> renkli metinlerin satın aldılar imkb Size ait İSTEDİĞİNİZ buton ismini ekleyın.</span><br />
<span style="color: red; font-size: large;"><i><br /></i></span>
<span style="color: red; font-size: large;"><i><br /></i></span>
<span style="color: red; font-size: large;"><i><br /></i></span>
<span style="color: red; font-size: large;"><i><br /></i></span>
<span style="color: red; font-size: large;"><i><br /></i></span>
<span style="color: red;"><i><span class="">Bizi Takip Edin</span></i></span><br />
<i><a href="http://http//www.dailymotion.com/Alper_Kaba_2#video=xzf06l/" target="_blank">Pinterest </a> <a href="https://www.facebook.com/trabzonlu.belaa" target="_blank">Facebook </a> <a href="https://twitter.com/kaba_mustafa" target="_blank">Twitter</a></i><br />
<span style="font-size: xx-small;"></span> <span style="color: #cccccc; font-size: xx-small;">© by <a href="http://etralibela-61.blogspot.com/" target="_blank">bilgicafem61</a></span><br />
  <br />
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_preferred_1" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_2" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_3" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_4" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_compact" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_counter addthis_bubble_style" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> </div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script> <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-51dbf8420e77f7e8" type="text/javascript"></script>  <br />
<div id="fb-root">
</div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>  <br />
<div class="fb-like" data-href="http://etralibela-61.blogspot.com/" data-send="true" data-show-faces="true" data-width="350">
</div>

Blogger İçin JavaScript Scrollbar Butonları

Blogger Sitenizde VEYA, wordpress, internet sitelerinizde FAZLA buton kullanmak gerektiği zamanlarda goruntu çirkinliğini ortad...

Devamı »

Blogger JavaScript Hareketli Buton Scripti

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs8Etkmn-fM3z7MlPBQtqlXipGr6meqg96phuoLa85QpzJxX-sB2TG6FWBRC_UvlUX9lBc8an5PydU8Yb36Be3D5VAbAkGqnkJ-XhuF48D3XyHKakDlU5gyIrJOF4ix6mR6BfTO1rUWZo/s1600/javascript_logo1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="141" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs8Etkmn-fM3z7MlPBQtqlXipGr6meqg96phuoLa85QpzJxX-sB2TG6FWBRC_UvlUX9lBc8an5PydU8Yb36Be3D5VAbAkGqnkJ-XhuF48D3XyHKakDlU5gyIrJOF4ix6mR6BfTO1rUWZo/s1600/javascript_logo1.png" width="200" /></a></div>
<br />
       Blogger sitenizde veya diğer sitelerde kullanabileceğiniz farklı şekilde butonlar sitenize ayrı bir özellik kadar,ve yazılarınızın daha kısa düzenli,karmaşıklığın ortadan kalkmasına yardımcı olabilecek,kolay ve ilgi çekici butonlarla işinizi halledebilirsiniz.<br />
<br />
       JavaScript kodlarını aşağıda verecem ve tek yapmanız gereken istediğiniz butonun javascript kodunu kopyalarak daha sonra düzenledikden sonra kullanabilirsiniz.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQednGIecKXcMUo-qwRhJkyBxjbgja6AaCx69QPzXxs2iSZ8vq5Qg5rLvnBllxgQ_TPCZKvsqyEC26Vn_Lxccx2yq51oIAY5ZQskpx5rUgJeMV3LcFVC-kyF-g5Uf1ySZ3FcLW2Bc1yTE/s1600/Javascript.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="164" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQednGIecKXcMUo-qwRhJkyBxjbgja6AaCx69QPzXxs2iSZ8vq5Qg5rLvnBllxgQ_TPCZKvsqyEC26Vn_Lxccx2yq51oIAY5ZQskpx5rUgJeMV3LcFVC-kyF-g5Uf1ySZ3FcLW2Bc1yTE/s1600/Javascript.png" width="200" /></a></div>
<span style="font-size: large;"><b>         </b></span><br />
         <span style="font-family: Georgia, Times New Roman, serif;"> Farklı farklı efektler sergileyen buton scripti,</span><br />
<span style="font-family: Georgia, Times New Roman, serif;">     Örnek Görüntü İçin Altta ki Butona Tıklayın,</span><br />
<div style="margin-top: 5px; margin: 20px;">
<div class="quotetitle">
<b>Göster Gizle Kodu</b> <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Gizle'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Göster'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 45px;" type="button" value="Göster" /></div>
<div class="quotecontent">
<div style="display: none;">
<br />
<body onload="StartHeadliner()" onunload="StopHeadliner()"><br />
<script language="JavaScript">

growWait=90
expandWait=120
scrollWait=100
scrollWidth=40
lineMax=4
lines=new Array(lineMax)

lines[1]=new Line("Bilgi Cafem 61", "http://etralibela-61.blogspot.com/", Expand, 2000)
lines[2]=new Line("SİTEMİZDEN YARARLANMANIZ İÇİN,", "http://etralibela-61.blogspot.com/", Scroll, 1000)
lines[3]=new Line("SİTEMİZE KATILIN.", "http://etralibela-61.blogspot.com/", Static, 2500)
lines[4]=new Line("@İstek öneri ve şikayetleriniz için", "mailto:musta.kaba61@gmail.com", Grow, 3000)

lineText=""
timerID=null
timerRunning=false
spaces=""
charNo=0
charMax=0
charMiddle=0
lineNo=0
lineWait=0

function Line(text, url, type, wait) {
 this.text=text
 this.url=url
 this.Display=type
 this.wait=wait

}

function StringFill(c, n) {
 s=""
 while (--n >= 0) {
  s+=c
 }

return s

}

function Static() {
 document.formDisplay.buttonFace.value=this.text
 timerID=setTimeout("ShowNextLine()", this.wait)

}

function Grow() {
 lineText=this.text
 lineWait=this.wait
 charMax=lineText.length
 TextGrow()

}

function TextGrow() {
 if (charNo <= charMax) {
  document.formDisplay.buttonFace.value=lineText.substring(0, charNo)
  charNo++
  timerID=setTimeout("TextGrow()", growWait)
 }
 else {
  charNo=0
  timerID=setTimeout("ShowNextLine()", lineWait)
 }
}

function Expand() {
 lineText=this.text
 charMax=lineText.length
 charMiddle=Math.round(charMax / 2)
 lineWait=this.wait
 TextExpand()
}

function TextExpand() {
 if (charNo <= charMiddle) {
  document.formDisplay.buttonFace.value=lineText.substring(charMiddle - charNo, charMiddle + charNo)
  charNo++
  timerID=setTimeout("TextExpand()", expandWait)
 }
 else {
  charNo=0
  timerID=setTimeout("ShowNextLine()", lineWait)
 }
}

function Scroll() {
 spaces=StringFill(" ", scrollWidth)
 lineText=spaces+this.text
 charMax=lineText.length
 lineText+=spaces
 lineWait=this.wait
 TextScroll()
}

function TextScroll() {
 if (charNo <= charMax) {
  document.formDisplay.buttonFace.value=lineText.substring(charNo, scrollWidth+charNo)
  charNo++
  timerID=setTimeout("TextScroll()", scrollWait)
 }
 else {
  charNo=0
  timerID=setTimeout("ShowNextLine()", lineWait)
 }
}

function StartHeadliner() {
 StopHeadliner()
 timerID=setTimeout("ShowNextLine()", 1000)
 timerRunning=true
}

function StopHeadliner() {
 if (timerRunning) { 
  clearTimeout(timerID)
  timerRunning=false
 }
}

function ShowNextLine() {
 (lineNo < lineMax) ? lineNo++ : lineNo=1
 lines[lineNo].Display()
}

function GotoUrl(url)
{
 top.location.href=url
}
// end hide </script></body>
</div>
</div>
</div>
</div>
<br />
<br />
<form name=""formDisplay"">
<div align=""center"">
<center>
<input class=""stHeadLiner"" name=""buttonFace"" onclick=""GotoUrl(lines[lineNo].url)"" type=""button"" value=""MERHABA."" /></center>
</div>
</form>
--><pre style="background-color: #eeeeee; border: 1px dashed rgb(153, 153, 153); font-family: 'Andale Mono', 'Lucida Console', Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;"><code>! & Lt; --- KAYNAK: http://etralibela-61.blogspot.com/ --- & gt; 
-lt, VÜCUT Onload = StartHeadliner () onunload = StopHeadliner () & gt; 
& lt; script language = JavaScript & gt;

growWait = 90 
expandWait = 120 
scrollWait = 100 
scrollWidth = 40 
lineMax = 4 
hat = new Array (lineMax)

hatları [1] yeni Hattı ("= <span style="color: red;">Bilgi Cafem 61</span> "," http://etralibela-61.blogspot.com/ ", genişletin 2000) 
hatları [2] yeni Hattı ("= <span style="color: red;">SİTEMİZDEN YARARLANMANIZ ıcın,</span> , Scroll, 1000) "," http://etralibela-61.blogspot.com/ " 
hatları [3] yeni Hattı (= " <span style="color: red;">SİTEMİZE katilin.</span> ", "http://etralibela-61.blogspot.com/", Statik, 2500) 
hatları [4] yeni Hattı = (" <span style="color: red;">Şikayetleriniz Click Here For ettik öneri istek @</span> "," mailto: <span style="color: red;"><b>Posta Adresiniz buraya</b></span> ", büyütün 
Hattı (metin, url, tip, bekle) { 
  this.text = metin 
  this.url = url 
  this.Display = yazın 
  = beklemeye this.wait 
} 
fonksiyonu StringFill (c, n) { 
  s = "" 
  ise (-N & gt ; = 0) { 
    s + = c 
  } 
  return s 
} 
fonksiyonu Statik () { 
  document.formDisplay.buttonFace.value = this.text 
  TimerID = setTimeout ("ShowNextLine ()", this.wait) 
} 
fonksiyonu) (Büyümek { 
  lineText = this.text 
  lineWait = this.wait 
  charMax = lineText.length 
  TextGrow () 
} 
işlevi TextGrow () { 
  (Charno ^ O charMax) halinde { 
    document.formDisplay.buttonFace.value = lineText.substring (0, Charno) 
    Charno ++ 
    TimerID = setTimeout ("TextGrow ()", growWait) 
  } 
  else { 
    Charno = 0 
    TimerID = setTimeout ("ShowNextLine ()", lineWait) 
  } 
} 
function (Expand) { 
  lineText = this.text 
  charMax = lineText.length 
  charMiddle = Math.round (charMax / 2) 
  = lineWait this.wait 
  TextExpand () 
} 
işlevi TextExpand () { 
  ise (Charno ^ O charMiddle) { 
    document.formDisplay.buttonFace.value = lineText.substring (charMiddle - Charno, charMiddle + Charno) 
    Charno ++ 
    TimerID = setTimeout ("TextExpand ()", expandWait) 
  } 
  else { 
    Charno = 0 
    TimerID = setTimeout ("ShowNextLine ()", lineWait) 
  } 
} 
fonksiyonu Scroll () { 
  alanlarda = StringFill ("", 
TextScroll () { 
  {(= charMax Charno & lt) ise 
    document.formDisplay.buttonFace.value = lineText.substring (Charno, scrollWidth + Charno) 
    Charno ++ 
    TimerID = setTimeout ("TextScroll ()", scrollWait) 
  } 
  else { 
    Charno = 0 
    TimerID = setTimeout ("ShowNextLine ()", lineWait) 
  } 
} 
fonksiyonu StartHeadliner () { 
  StopHeadliner () 
  TimerID = setTimeout ("ShowNextLine ()", 1000) 
  timerRunning = true 
} 
fonksiyonu StopHeadliner () { 
  (timerRunning) {if 
    clearTimeout ( TimerID) 
    timerRunning = false 
  } 
} 
fonksiyonu ShowNextLine () { 
  (LINENO & lt; lineMax) LINENO ++:? LINENO = 1 
  hatları [LINENO] .Display () 
} 
fonksiyonu GotoUrl (url) 
{ 
  top.location.href = url 
} 
// sonu hide - & gt; 
& lt; / SCRIPT & gt; 
& lt; FORMU name = formDisplay & gt; 
& lt; div align = center & gt; 
& lt; ORTA & gt; 
-lt P & gt; & lt; GİRİŞ class = stHeadLiner name = buttonFace onclick = GotoUrl (hatları [LINENO]. url) type = butonu value = " <span style="color: red;">MERHABA.</span> "& gt; & lt; / P & gt; & lt; / MERKEZİ & gt; & lt; / div & gt; & lt; / FORM & gt; 
& lt; --- KAYNAK: http: //etralibela-61.blogspot com / --- & gt;

<span style="color: red;"></span>
</code></pre>
<br />
      Kod içerisinde <span style="color: red;">kırmızı</span> ile belirtilmiş yerleri siz kendinize göre düzenleyin.<br />
  <br />
          <br />
<div style="margin-top: 5px; margin: 20px;">
<div class="quotecontent">
<div style="display: none;">
<br />
<body onload="StartHeadliner()" onunload="StopHeadliner()"><br />
<script language="JavaScript">

growWait=90
expandWait=120
scrollWait=100
scrollWidth=40
lineMax=4
lines=new Array(lineMax)

lineText=""
timerID=null
timerRunning=false
spaces=""
charNo=0
charMax=0
charMiddle=0
lineNo=0
lineWait=0

function Line(text, url, type, wait) {
  this.text=text
  this.url=url
  this.Display=type
  this.wait=wait

}

function StringFill(c, n) {
  s=""
  while (--n >= 0) {
    s+=c
  }

return s

}

function Static() {
  document.formDisplay.buttonFace.value=this.text
  timerID=setTimeout("ShowNextLine()", this.wait)

}

function Grow() {
  lineText=this.text
  lineWait=this.wait
  charMax=lineText.length
  TextGrow()

}

function TextGrow() {
  if (charNo <= charMax) {
    document.formDisplay.buttonFace.value=lineText.substring(0, charNo)
    charNo++
    timerID=setTimeout("TextGrow()", growWait)
  }
  else {
    charNo=0
    timerID=setTimeout("ShowNextLine()", lineWait)
  }
}

function Expand() {
  lineText=this.text
  charMax=lineText.length
  charMiddle=Math.round(charMax / 2)
  lineWait=this.wait
  TextExpand()
}

function TextExpand() {
  if (charNo <= charMiddle) {
    document.formDisplay.buttonFace.value=lineText.substring(charMiddle - charNo, charMiddle + charNo)
    charNo++
    timerID=setTimeout("TextExpand()", expandWait)
  }
  else {
    charNo=0
    timerID=setTimeout("ShowNextLine()", lineWait)
  }
}

function Scroll() {
  spaces=StringFill(" ", scrollWidth)
  lineText=spaces+this.text
  charMax=lineText.length
  lineText+=spaces
  lineWait=this.wait
  TextScroll()
}

function TextScroll() {
  if (charNo <= charMax) {
    document.formDisplay.buttonFace.value=lineText.substring(charNo, scrollWidth+charNo)
    charNo++
    timerID=setTimeout("TextScroll()", scrollWait)
  }
  else {
    charNo=0
    timerID=setTimeout("ShowNextLine()", lineWait)
  }
}

function StartHeadliner() {
  StopHeadliner()
  timerID=setTimeout("ShowNextLine()", 1000)
  timerRunning=true
}

function StopHeadliner() {
  if (timerRunning) { 
    clearTimeout(timerID)
    timerRunning=false
  }
}

function ShowNextLine() {
  (lineNo < lineMax) ? lineNo++ : lineNo=1
  lines[lineNo].Display()
}

Blogger JavaScript Hareketli Buton Scripti

Blogger sitenizde veya diğer sitelerde kullanabileceğiniz farklı şekilde butonlar sitenize ayrı bir özellik kadar,ve yazılarınızı...

Devamı »

Blogger İçin Klasik Drop Down CSS3 Açılır Menü Eklentisi

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDGPp8kqO-nG4AlUFGmrh5VqZ-gBFZFzZa6u1kDeLoVOXiBJTWx7Kymz6UOqPnYynZhWw42wFZ7hcpbLPwyfZTpaXRvVpFWK0uZlAF4MfG1VsEuAHngXsdjBy1JbaU7Uuju-bGRgop54c/s1600/css3-multi-level-dropdown-menum.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="132" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDGPp8kqO-nG4AlUFGmrh5VqZ-gBFZFzZa6u1kDeLoVOXiBJTWx7Kymz6UOqPnYynZhWw42wFZ7hcpbLPwyfZTpaXRvVpFWK0uZlAF4MfG1VsEuAHngXsdjBy1JbaU7Uuju-bGRgop54c/s1600/css3-multi-level-dropdown-menum.jpg" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1LnMWJF9QkIuADkOLxAAMD9sxNvGxPmvW1r02-MWj60v0V_8SqD8wbWEIYL34g-EhP7MfTvzkFe2yFChstWi9hcNPY_yhtgpxktdLC07C5d8eMmnqXVNq5JBFQl7-ftXpkFLswJiyiiY/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="27" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1LnMWJF9QkIuADkOLxAAMD9sxNvGxPmvW1r02-MWj60v0V_8SqD8wbWEIYL34g-EhP7MfTvzkFe2yFChstWi9hcNPY_yhtgpxktdLC07C5d8eMmnqXVNq5JBFQl7-ftXpkFLswJiyiiY/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1a.JPG" width="400" /></a></div>
<br />
<br />
<br />
<ol style="text-align: left;">
<li><span style="font-family: Georgia, Times New Roman, serif;">Blogger hesabınıza giriş yapın.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Kumanda Paneli>Yerleşim>Gadget Ekle yolunu izliyoruz.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Altta ki resimdeki gibi Blog başlık isminizin altındaki Gadget ekle butonuna tıklayın.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Açmış olduğunuz gadgetin içine aşağıdaki kodları ekleyin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Bu CSS3 açılır menüyü kullanabilmeniz için blogger klasik veya basit temalarından birini kullanmak zorundasınız.</span></li>
</ol>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZPiIKdaWv9gJyU5vNLuwCp5Ukp-QOzYNPaAnc6grAA-a3-Bkd0xBRSTnbS-D_VBOYrGE8SJHAPS6kXvS2Qnk12qbnwuHEAgkPPK_l1EVYitMNPBw08k741IcogtUQ8NS8nic9VeZgV-g/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="107" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZPiIKdaWv9gJyU5vNLuwCp5Ukp-QOzYNPaAnc6grAA-a3-Bkd0xBRSTnbS-D_VBOYrGE8SJHAPS6kXvS2Qnk12qbnwuHEAgkPPK_l1EVYitMNPBw08k741IcogtUQ8NS8nic9VeZgV-g/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1.JPG" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div>
</div>
<pre style="background-color: #eeeeee; border: 1px dashed rgb(153, 153, 153); font-family: 'Andale Mono', 'Lucida Console', Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;"><code><style> / * Başlat Css Menu * /
. Menüsü {
    border: none;
    border: 0px;
    margin: 0px;
    padding: 0px;
    font-family: verdana, geneva, arial, helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: 8e8e8e;
}

. Menü ul {
    background: top tekrar-x bıraktı;
    height: 43px;
    list-style: none;
    margin: 0;
    padding: 0;
}

. Menüsü li {
    float: left;
    padding: 0px 0px 8px 8px;
}

. Menü li a {
    color: <span style="color: orange;"># 666666</span>;
    display: block;
    font-weight: bold;
    line-height: 43px;
    padding: 0px 25px;
    text-align: center;
    text-decoration: none;
}

. Menüsü li a: hover {
    color: <span style="color: orange;"># 000000</span>;
    text-decoration: none;
}

. Menüsü li ul {
    background: <span style="color: orange;"># e0e0e0</span>;
    border-left: 2px solid # a80329;
    border-right: 2px solid # a80329;
    border-bottom: 2px solid # a80329;
    display: none;
    height: auto;
    Filtre: alpha (opacity = 95);
    opacity: 0.95;
    position: absolute;
    width: 225px;
    z-index: 200;
/ * Top: 1em;
/ * Sol: 0; * /
}

. Menüsü li: hover ul {
    display: block;
}

. Menüsü li li {
    display: block;
    şamandıra: none;
    padding: 0px;
    width: 225px;
}

. Menüsünde li ul a {
    display: block;
    font-size: 12px;
    font-style: normal;
    padding: 0px 0px 10px 15px;
    text-align: left;
}

. Hover {: menu li a ul
    background: # 949494;
    color: # 000000;
    opacity: 1.0;
    Filtre: alpha (opacity = 100);
}

. Menüsünde p {
    clear: left;
}

. Menüsü # geçerli {
    background: top tekrar-x bıraktı;
    color: # ffffff;
}

/ * Den Sona Css Menu http://etralibela-61.blogspot.com/ * /
</ Style>

<div class="menu">
 <ul>
  <li> <a href="<span style="color: red;">#</span>" id="current"> <span style="color: blue;">Ana Sayfa</span> </ a> </ li>
  <li> <a href="<span style="color: red;">#</span>"> Ürünler </ a>
  <ul>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Açılır CSS Menüler</span> </ a> </ li>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Yatay CSS Menüler</span> </ a> </ li>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Dikey CSS Menüler</span> </ a> </ li>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Dreamweaver Menüler</span> </ a> </ li>
  </ Ul>
  </ Li>
  <li> <a href="<span style="color: red;">#</span>"> <span style="color: blue;">Yardım</span> </ a>
  <ul>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Açılır CSS Menüler </span></ a> </ li>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Yatay CSS Menüler</span> </ a> </ li>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Dikey CSS Menüler</span> </ a> </ li>
   <li> <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Dreamweaver Menüler</span> </ a> </ li>
  </ Ul>
  </ Li>
  <li> <a href="<span style="color: red;">#</span>"> <span style="color: blue;">İletişim</span> </ a> </ li>
  <li> <a href = " http://etralibela-61.blogspot.com/ "> Bilgi Cafem 61 </ a> </ li>
 </ Ul>
</ Div>
</code></pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC63Y_Nh-e0wT7dxwvCKHj9Jj2QJ4gs46EyzhN3hE_iDVnEXr5mevu_Wkvgt4FtjkPC1bAPorrsNgveWFcsxkC8dDoBJcy2yMaOZa_moBONFjgvT9AaHBLpRNW6esqKULyo1YCe8y1L4A/s1600/1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="23" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC63Y_Nh-e0wT7dxwvCKHj9Jj2QJ4gs46EyzhN3hE_iDVnEXr5mevu_Wkvgt4FtjkPC1bAPorrsNgveWFcsxkC8dDoBJcy2yMaOZa_moBONFjgvT9AaHBLpRNW6esqKULyo1YCe8y1L4A/s1600/1.JPG" width="400" /></a></div>
<br />
<br />
<ul style="text-align: left;">
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: blue;">Mavi</span> link yerine blogger adresinizin linkini ekleyin,</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: lime;">Yeşil </span>yazılı olan metin başlıkları yerine sizin istediğiniz başlıkları ekleyin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: red;">Kırmızı</span> renkdeki yerlere başlık linkleri ekleyecek olduğunuz bölümlerdir.</span></li>
</ul>
<br />
<br />
<br />
<br />
<br />
<span style="color: red;"><i>Bizi Takip Edin</i></span><br />
<i><a href="http://http//www.dailymotion.com/Alper_Kaba_2#video=xzf06l/" target="_blank">Pinterest</a> <a href="https://www.facebook.com/trabzonlu.belaa" target="_blank">Facebook</a> <a href="https://twitter.com/kaba_mustafa" target="_blank">Twitter</a></i><br />
 <span style="color: #cccccc;">© by <a href="http://etralibela-61.blogspot.com/" target="_blank">bilgicafem61</a></span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><i>Aşağıda Yorum ve Sorularınızı Bırakın. </i></span><br />
  <br />
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_preferred_1" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_2" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_3" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_4" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_compact" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_counter addthis_bubble_style" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> </div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script> <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-51dbf8420e77f7e8" type="text/javascript"></script>  <br />
<div id="fb-root">
</div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>  <br />
<div class="fb-like" data-href="http://etralibela-61.blogspot.com/" data-send="true" data-show-faces="true" data-width="350">
</div>
</div>

Blogger İçin Klasik Drop Down CSS3 Açılır Menü Eklentisi

Blogger hesabınıza giriş yapın. Kumanda Paneli>Yerleşim>Gadget Ekle yolunu izliyoruz. Altta ki resimdeki gibi Blog başlık ...

Devamı »

Blogger İçin CSS3 Açılır Multi Level Menü

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimVNhbdZY4f7Ga0l25Y0eLmsupFJJ-Pczaqi9N71uAydqHl_qMx1aD5aQZmizpKBgR052d7O4kk3fo8tqboZz_qlDZWmA6OiWNBGJOZXe4WsSfkTRatcAPurPR6lVsJgpXJwX-wLKUnz8/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1z.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimVNhbdZY4f7Ga0l25Y0eLmsupFJJ-Pczaqi9N71uAydqHl_qMx1aD5aQZmizpKBgR052d7O4kk3fo8tqboZz_qlDZWmA6OiWNBGJOZXe4WsSfkTRatcAPurPR6lVsJgpXJwX-wLKUnz8/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1z.JPG" width="320" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjubG3XG-h2cWPucBXuDa5MW7TvE6MUe2ZUQ5NT3-xAAlIwBpLN4dPJXb3kcMPJPD6x8w864KURRCk1QooswhAU_FaGnpRmjw1g6FI2-WnG0NSII5FgFJqabYpvGSGS_eRpP-HhYXWeleU/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1a.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="27" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjubG3XG-h2cWPucBXuDa5MW7TvE6MUe2ZUQ5NT3-xAAlIwBpLN4dPJXb3kcMPJPD6x8w864KURRCk1QooswhAU_FaGnpRmjw1g6FI2-WnG0NSII5FgFJqabYpvGSGS_eRpP-HhYXWeleU/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1a.JPG" width="400" /></a></div>
<br />
<br />
<br />
<ol style="text-align: left;">
<li><span style="font-family: Georgia, Times New Roman, serif;">Blogger hesabınıza giriş yapın.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Kumanda Paneli> Yerleşim> Gadget ekle yolunu izleyin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Açmış olduğunuz gadgetin içine aşağıdaki kodları ekleyin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Alttaki resimde ki gibi Blogger site adınızın altındaki gadget'i seçin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Bu özelliği kullanabilmeniz için blogger'in klasik veya basit temalarından birini kullanmanız gerekir.</span></li>
</ol>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM6H58JiOm31y4D21uTLYASXLAkiaz3ldfJvR-xdVZfaT4JeRwiDjp-Mf1xqTpbImaRb_0kY1hEriHJEQrZtbYLcvc-uN-65nAC6owdbsTcO8yDoJCEUztv0YaGYrbblxSOpMytDcw3Vk/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="106" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM6H58JiOm31y4D21uTLYASXLAkiaz3ldfJvR-xdVZfaT4JeRwiDjp-Mf1xqTpbImaRb_0kY1hEriHJEQrZtbYLcvc-uN-65nAC6owdbsTcO8yDoJCEUztv0YaGYrbblxSOpMytDcw3Vk/s1600/Ekran+Al%C4%B1nt%C4%B1s%C4%B1.JPG" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<pre class="source-code"></pre>
<pre style="background-color: #eeeeee; border: 1px dashed rgb(153, 153, 153); font-family: 'Andale Mono', 'Lucida Console', Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;"><code><style>
# Nav {
    margin: 0;
    padding: 7PX 6px 0;
    background: # 7d7d7d url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7OgU3GNYQWPxq-QFeCsjUDIoWb2X9kXnXKh7hkt_JAAuEPGfUwrLvr42Z2ybtfpYJ2c1ZF_LUhqMmhU_cL8EPi_DfNPlVGIsNgWqe5-G7LBU7ZyLY9Av6Nhg5TXMBAXSVJVMYWIssKkc/s1600/hb-gradient.png) repeat-x 0-110px;
    line-height: 100%;
    border-radius: 2em;
    -Webkit-border-radius: 2em;
    -Moz-border-radius: 2em;
    -Webkit-box-shadow: 0 1px 3px rgba (0,0,0, .4);
    -Moz-box-shadow: 0 1px 3px rgba (0,0,0, .4);
    width: 100%
}

# Nav li {
    margin: 0 5px;
    padding: 0 0 8px;
    float: left;
    position: relative;
    list-style: none;
    font-family: Calibri;
}

/ * Ana düzey bağlantısı * /
# {A nav
    font-weight: bold;
    color: # e7e5e5;
    text-decoration: none;
    display: block;
    padding: 20px 8px;
    margin: 0;
    -Webkit-border-radius: 1.6em;
    -Moz-border-radius: 1.6em;
    text-shadow: 1px 1px 0 rgba (0,0,0, .3);
}

# Nav a: hover {
    background: # 000;
    color: # fff;
}

/ * Ana düzey bağlantı hover * /
. # Nav akım, # nav li: hover> a {
    background: # 666 url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7OgU3GNYQWPxq-QFeCsjUDIoWb2X9kXnXKh7hkt_JAAuEPGfUwrLvr42Z2ybtfpYJ2c1ZF_LUhqMmhU_cL8EPi_DfNPlVGIsNgWqe5-G7LBU7ZyLY9Av6Nhg5TXMBAXSVJVMYWIssKkc/s1600/hb-gradient.png) repeat-x 0-40px;
    color: # 444;
    border-top: 1px solid # f8f8f8;
    -Webkit-box-shadow: 1px 1px 0 rgba (0,0,0, .2);
    -Moz-box-shadow: 1px 1px 0 rgba (0,0,0, .2);
    box-shadow: 1px 1px 0 rgba (0,0,0, .2);
    text-shadow: 1px 0 0 rgba (255,255,255, 1);
}

/ * Alt seviyeleri * / hover bağlantı
# Nav ul li: hover li a {: a, # nav li hover
    background: none;
    border: none;
    color: # 666;
    -Webkit-box-shadow: none;
    -Moz-box-shadow: none;
}

# Nav ul a: hover {
    background: # 0078ff url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7OgU3GNYQWPxq-QFeCsjUDIoWb2X9kXnXKh7hkt_JAAuEPGfUwrLvr42Z2ybtfpYJ2c1ZF_LUhqMmhU_cL8EPi_DfNPlVGIsNgWqe5-G7LBU7ZyLY9Av6Nhg5TXMBAXSVJVMYWIssKkc/s1600/hb-gradient.png) repeat-x 0-100px önemlidir;
    color: # fff önemlidir;
    -Webkit-border-radius: 0;
    -Moz-border-radius: 0;
    text-shadow: 1px 1px 0 rgba (0,0,0, .1);
}

/ * Açılan * /
# Nav li: hover> ul {
    display: block;
}

/ * 2. seviye listesi * /
# Nav ul {
    display: none;
    margin: 0;
    padding: 0;
    width: 185px;
    position: absolute;
    top: 35px;
    Sol: 0;
    background: # ddd url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7OgU3GNYQWPxq-QFeCsjUDIoWb2X9kXnXKh7hkt_JAAuEPGfUwrLvr42Z2ybtfpYJ2c1ZF_LUhqMmhU_cL8EPi_DfNPlVGIsNgWqe5-G7LBU7ZyLY9Av6Nhg5TXMBAXSVJVMYWIssKkc/s1600/hb-gradient.png) tekrar-x 0 0;
    border: 1px solid # b4b4b4;
    -Webkit-border-radius: 10px;
    -Moz-border-radius: 10px;
    border-radius: 10px;
    -Webkit-box-shadow: 0 1px 3px rgba (0,0,0, .3);
    -Moz-box-shadow: 0 1px 3px rgba (0,0,0, .3);
    box-shadow: 0 1px 3px rgba (0,0,0, .3);
}

# Nav ul li {
    şamandıra: none;
    margin: 0;
    padding: 0;
}

# Nav ul a {
    font-weight: normal;
    text-shadow: 1px 0 0 # fff;
}

/ * Seviye 3 + listesi * /
# Nav ul ul {
    Sol: 181px;
    top:-3px;
}

İlk ve son bağlantının / * yuvarlatılmış köşeler * /
# Nav ul li: first-child> a {
    -Webkit-border-top-left-radius: 9px;
    -Moz-border-radius-topleft: 9px;
    -Webkit-border-top-right-radius: 9px;
    -Moz-border-radius-TopRight: 9px;
}

# Nav ul li: last-child> a {
    -Webkit-border-bottom-left-radius: 9px;
    -Moz-border-radius-bottomleft: 9px;
    -Webkit-border-bottom-right-radius: 9px;
    -Moz-border-radius-bottomright: 9px;
}

/ * Clearfix * /
# Nav: {sonra
    içerik: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

# Nav {
    display: inline-block;
}

html [xmlns] # nav {
    display: block;
}

* Html # nav {
    height: 1%;
}
</ Style>
<ul id="nav">
  <li>
            <A href = " <span style="color: blue;">http://etralibela-61.blogspot.com/</span>"> Ana Sayfa </ a>
        </ Li>
        <li>
            <a href="#"> <span style="color: orange;">Klasör 0</span> </ a>
            <ul>
                <li>
                    <a href="#"> <span style="color: lime;">Sub Item 1.1</span> </ a>
                </ Li>
                <li>
                    <a href="#"> <span style="color: lime;">Sub Item 1.2</span> </ a>
                </ Li>
            </ Ul>
        </ Li>
        <li>
            <a href="#"> <span style="color: orange;">Klasör 1</span> </ a>
            <ul>
                <li>
                    <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Sub Item 1.1</span> </ a>
                </ Li>
                <li>
                    <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Sub Item 1.2</span> </ a>
                </ Li>
            </ Ul>
        </ Li>
        <li>
            <a href="<span style="color: red;">#</span>"> <span style="color: orange;">Ürün 3</span> </ a>
        </ Li>
        <li>
            <a href="<span style="color: red;">#</span>"> <span style="color: orange;">Klasör 2</span> </ a>
            <ul>
                <li>
                    <a href="<span style="color: red;">#</span>"> <span style="color: lime;">Sub Item 2.1</span> </ a>
                </ Li>
            </ Ul>
        </ Li>
        <li>
            <A href = " <span style="color: blue;">http://etralibela-61.blogspot.com/</span>"> <span style="color: yellow;">Bu oluşturun</span> </ a>
        </ Li>
    </ Ul>
</code></pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJKsp8NL7Om0gUSf6GQ4F2HZvMEyi7pIt8QQMysIPuNhfSBLSts91k3r3Nhz4lRk0K8IkxvzL1fwWQMgLJyPqDQnLrEILj15zYatEXxxkb-uGF0yIuHxsY0Fk_PsG7QYD3PoMgFO7YKII/s1600/1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="23" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJKsp8NL7Om0gUSf6GQ4F2HZvMEyi7pIt8QQMysIPuNhfSBLSts91k3r3Nhz4lRk0K8IkxvzL1fwWQMgLJyPqDQnLrEILj15zYatEXxxkb-uGF0yIuHxsY0Fk_PsG7QYD3PoMgFO7YKII/s1600/1.JPG" width="400" /></a></div>
<br />
<br />
<br />
<ul style="text-align: left;">
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: blue;">Mavi</span> link yerine kendi blogger sitenizin linkini ekleyin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: lime;">Yeşil</span> yazılı metin yerine ekliyecek olduğunuz başlık kısımlarıdır.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: orange;">Turuncu</span> yazılı olan yerler başlık kısımlarıdır.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><span style="color: red;">Kırmızı (#) </span>olan yerlere buton başlık linkleri ekliyecek olan kısımdır.</span></li>
</ul>
<br />
<br />
<span style="color: red;"><i>Bizi Takip Edin</i></span><br />
<i><a href="http://http//www.dailymotion.com/Alper_Kaba_2#video=xzf06l/" target="_blank">Pinterest</a> <a href="https://www.facebook.com/trabzonlu.belaa" target="_blank">Facebook</a> <a href="https://twitter.com/kaba_mustafa" target="_blank">Twitter</a></i><br />
 <span style="color: #cccccc;">© by <a href="http://etralibela-61.blogspot.com/" target="_blank">bilgicafem61</a></span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><i>Aşağıda Yorum ve Sorularınızı Bırakın. </i></span><br />
  <br />
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_preferred_1" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_2" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_3" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_4" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_compact" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_counter addthis_bubble_style" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> </div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script> <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-51dbf8420e77f7e8" type="text/javascript"></script>  <br />
<div id="fb-root">
</div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>  <br />
<div class="fb-like" data-href="http://etralibela-61.blogspot.com/" data-send="true" data-show-faces="true" data-width="350">
</div>
</div>

Blogger İçin CSS3 Açılır Multi Level Menü

Blogger hesabınıza giriş yapın. Kumanda Paneli> Yerleşim> Gadget ekle yolunu izleyin. Açmış olduğunuz gadgetin içine aşağı...

Devamı »

CSS Çember Düğme Oluşturmak

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvekl1y-9jzZL8rsPtnmAv6VkhYjpaX4GsLdlkwyvjYfX5UxXNCDBNRMvg0UXBKKdAtj_SlGMA84Lh8QnOOPvHUmWioZIadBKbJZ1uaIK-pKaErmXQ6cb9nyww1GoCsKoRaqvsXPdoeIY/s1600/p.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="153" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvekl1y-9jzZL8rsPtnmAv6VkhYjpaX4GsLdlkwyvjYfX5UxXNCDBNRMvg0UXBKKdAtj_SlGMA84Lh8QnOOPvHUmWioZIadBKbJZ1uaIK-pKaErmXQ6cb9nyww1GoCsKoRaqvsXPdoeIY/s1600/p.JPG" width="320" /></a></div>
<br />
<br />
<br />
<b><span style="color: #4c1130; font-family: Georgia, Times New Roman, serif;">                     Blogger'e Eklenmek İçin İşlemler yapilacak;</span></b><br />
<br />
         <span style="font-family: Georgia, Times New Roman, serif;">CSS Çember Düğme özelliğini blogger Yazılarınız icinde Paylaşmak Click tek yapmanız gereken yönetsel bilgi aşağıdaki kodları kopyalayıp blogger yazılarınızda <b>HTML</b> kısmına gelerek kodları yapıştırın A.Ş. yazılnıza devam Etmek Click Tekrar <b>Oluştur</b> kısmına for English.</span><br />
<br />
<br />
<b><span style="font-family: Georgia, Times New Roman, serif;">          Kodlar;</span></b><br />
<pre style="background-color: #eeeeee; border: 1px dashed rgb(153, 153, 153); font-family: 'Andale Mono', 'Lucida Console', Monaco, fixed, monospace; font-size: 12px; line-height: 14px; overflow: auto; padding: 5px; width: 100%;"><code>& Lt;! DOCTYPE html & gt;
& Lt; html & gt;
& Lt; head & gt;
    & Lt; title & gt; & lt; / title & gt;
    & Lt; meta http-equiv = "Content-Type" content = "text / html; charset = UTF-8" & gt;
    & Lt; style = "text / css" & gt tipi;
    vücut {
        font-family: Arial, sans-serif;
    }

#container {
        margin: 120px auto;
        text-align: center;
    }

{.button
        -webkit-dönüşümü: rotateX (35deg);
        position: relative;
        display: inline-block;
        genişliği: 100px;
        padding: 42px 15px;
        margin: 10px 0px;
        background-color: # C91826;
        Renk: #fff;
        font-weight: bold;
        font-size: 40px;
        text-decoration: none;
        text-align: center;
        text-shadow: 0px 0px -1px rgba (0,0,0,0.5);

border: 1px solid;
        border-color: # B21522;
        border-radius: 78px;
        -moz-border-radius: 78px;
        -webkit-border-radius: 78px;

box-shadow: İçerlek 0px -4px 5px rgba (255,255,255,0.2),
                            İçerlek 0px 1px 5px rgba (255,255,255,0.2),
                            / ** /
                            0px 0px 12px # 231F20,
                            0px 0px 14px # 231F20,
                            0px 0px 16px # 231F20,
                            / ** /
                            0px 8px 5px rgba (0,0,0,0.5);

-moz-box-shadow: İçerlek 0px -4px 5px rgba (255,255,255,0.2),
                            İçerlek 0px 1px 5px rgba (255,255,255,0.2),
                            / ** /
                            0px 0px 12px # 231F20,
                            0px 0px 14px # 231F20,
                            0px 0px 16px # 231F20,
                            / ** /
                            0px 8px 5px rgba (0,0,0,0.5);

-webkit-box-shadow: İçerlek 5px 5px -4px rgba (255,255,255,0.2),
                            İçerlek 5px 5px 1px rgba (255,255,255,0.2),
                            / ** /
                            0px 0px 12px # 231F20,
                            0px 0px 14px # 231F20,
                            0px 0px 16px # 231F20;
    }

.button: hover {
        background-color: # B21522;
        color: # e3e3e3;
    }

.button: aktif {
        top: 8px;
        box-shadow: İçerlek 0px 4px 5px rgba (255,255,255,0.4),
                            İçerlek 0px -1px 5px rgba (255,255,255,0.2),
                            / ** /
                            0px 0px 8px # 231F20,
                            / ** /
                            0px 9px 5px rgba (0,0,0,0.5);

-moz-box-shadow: İçerlek 0px 4px 5px rgba (255,255,255,0.4),
                            İçerlek 0px -1px 5px rgba (255,255,255,0.2),
                            / ** /
                            0px 0px 8px # 231F20,
                            / ** /
                            0px 9px 5px rgba (0,0,0,0.5);

-webkit-box-shadow: İçerlek 0px 4px RGBA 5px (255,255,255,0.4),
                            İçerlek 0px -1px 5px rgba (255,255,255,0.2),
                            / ** /
                            0px 0px 8px # 231F20,
                            / ** /
                            0px 9px 5px rgba (0,0,0,0.5);
    }
    & Lt; / style & gt;
& Lt; / head & gt;
& Lt; body & gt;
  & Lt; div id = "konteyner" & gt;
    & Lt; a href = " <span style="color: blue;">#</span> "class =" button "& gt; <span style="color: red;">itin</span> & lt; / a & gt;
    & Lt; a href = " <span style="color: blue;">#</span> "class =" button "& gt; <span style="color: red;">Dur</span> & lt; / a & gt;
  & Lt; / div & gt;
& Lt; / body & gt;
& Lt; / html & gt;

</code></pre>
<br />
<span style="font-family: Georgia, Times New Roman, serif;"><span style="color: blue;">             Mavi</span> renkli Olan bölüme <span style="color: blue;">#</span> işaretinin önüne butona tıklanıldığında açılmasını istediginiz linki ekleyın.</span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><span style="color: red;">             Kırmızı</span> Yazılı Olan yerler butonların baslik kısmıdır.</span><br />
<br />
<br />
<br />
<br />
<br />
<span style="color: red; font-size: large;"><i>Delice Takip Edin</i></span><br />
<span style="font-size: medium;"><i><a href="http://http//www.dailymotion.com/Alper_Kaba_2#video=xzf06l/" target="_blank">Pinterest </a> <a href="https://www.facebook.com/trabzonlu.belaa" target="_blank">Facebook </a> <a href="https://twitter.com/kaba_mustafa" target="_blank">Twitter</a></i></span><br />
<span style="font-size: xx-small;"></span> <span style="color: #cccccc; font-size: xx-small;">© by <a href="http://etralibela-61.blogspot.com/" target="_blank">bilgicafem61</a></span><br />
<span style="font-family: Georgia, Times New Roman, serif;"><i><span style="font-size: large;">Aşağıda Yorum Toplam Sorularinizi Bırakın ettik</span> .</i></span><br />
  <br />
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_preferred_1" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_2" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_3" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_preferred_4" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_button_compact" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> <a class="addthis_counter addthis_bubble_style" href="https://draft.blogger.com/blogger.g?blogID=1758408898395549933"></a> </div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script> <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-51dbf8420e77f7e8" type="text/javascript"></script>  <br />
<div id="fb-root">
</div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>  <br />
<div class="fb-like" data-href="http://etralibela-61.blogspot.com/" data-send="true" data-show-faces="true" data-width="350">
</div>
</div>

CSS Çember Düğme Oluşturmak

Blogger'e Eklenmek İçin İşlemler yapilacak; CSS Çember Düğme özelliğini blogger Yazılarınız icind...

Devamı »

Balon Efektli CSS Blogger Buton Yapımı

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDyG9p-eOTO5LfkZBhbFo_WWhuKs5zz-I1NuNG7iAu2F2udEA5VFaNrZ7Wp1_w1cUvL1gtbQzbmRPhNWo6aSc_f8TsglMAbXHK74Zmji8no_sQqTZN1S3ldy8_FVvi7ULLkMbbI0gSIOU/s1600/nb.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="278" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDyG9p-eOTO5LfkZBhbFo_WWhuKs5zz-I1NuNG7iAu2F2udEA5VFaNrZ7Wp1_w1cUvL1gtbQzbmRPhNWo6aSc_f8TsglMAbXHK74Zmji8no_sQqTZN1S3ldy8_FVvi7ULLkMbbI0gSIOU/s1600/nb.jpg" width="320" /></a></div>
<div style="text-align: left;">
<span style="font-family: Georgia, Times New Roman, serif;"><span style="background-color: white; line-height: 20px; text-align: justify;">Hepimiz blogumuzda Zaman Zaman  </span><b style="background-color: white; line-height: 20px; text-align: justify;">izle, demo Görünüm, indir, bağlan </b><span style="background-color: white; line-height: 20px; text-align: justify;"> Gibi farkli amaçlar Click butonlar kullanıyoruz.Bugün sizlere farkli amaçlar Click kullanabileceğimiz farkli boyutlarda A.Ş. renklerde butonlara AIT  </span><b style="background-color: white; line-height: 20px; text-align: justify;">CSS  </b><span style="background-color: white; line-height: 20px; text-align: justify;">kodları Ile Ayri Ayri Farklı renklerde buton kodarını verecem.Butonlar Görünüm Olarak Resimde gördüğünüz Gibi maus Ile buton Üstüne geldiğimizde buton İÇERİSİNDE baloncuklar uçuşuyor, Görünüm Olarak Gerçekten çok şık A.Ş. Bir o kadarda Kullanışlı butonları blogumuza uygulayacağız,</span></span></div>
<div style="text-align: left;">
<span style="background-color: white; font-family: Arial, Verdana, sans-serif; font-size: 14px; line-height: 20px; text-align: justify;"><br />
</span></div>
<div style="text-align: left;">
<span style="background-color: white; font-family: Arial, Verdana, sans-serif; font-size: 14px; line-height: 20px; text-align: justify;"><br />
</span></div>
<div style="text-align: left;">
<br /></div>
<span style="color: #4c1130; font-family: Georgia, Times New Roman, serif;"><b>Balon Efektli CSS Blogger Buton Yapımı Kodlarını Bloggere Ekleme;</b></span><br />
<ol style="background-color: white; font-size: 14px; line-height: 20px;">
<li><span style="font-family: Georgia, Times New Roman, serif;"><b>Kumanda Paneli & gt; SABLON & gt; Htmlyi Düzenle </b> yolunu konumundadır edin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><b>Şablonunuzun yedeğini alın.Widget Şablonlarını genişlet</b>  kutucuğunu işaretleyin.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;"><b>HTML</b>  kodları İÇERİSİNDE  <b style="color: blue;">]] & gt; & lt; / b: skin & gt; </b> Kodunu  <b>Ctrl + F</b>  yardımı Ile aratıp BULUN.</span></li>
<li><span style="font-family: Georgia, Times New Roman, serif;">Aşağıdaki kodu kopyalayarak bulduğumuz  <span style="color: blue;"><b>]] & gt; & lt; / b: skin & gt;</b></span><b><span style="color: blue;"></span></b><b><span style="color: blue;"> </span></b>kodundan Onceki Kisma yapıştırın.</span></li>
</ol>
<textarea class="bginput" cols="42" name="wep-kodlari" onclick="this.focus();this.select()" rows="5" style="height: 186px; margin: 0px; width: 640px;">.button {<br />
font: 15px Calibri, Arial, sans-serif;<br />
/* A semi-transparent text shadow */<br />
text-shadow: 1px 1px 0 rgba(255,255,255,0.4);<br />
/* Overriding the default underline styling of the links */<br />
text-decoration: none !important;<br />
white-space: nowrap;<br />
display: inline-block;<br />
vertical-align: baseline;<br />
position: relative;<br />
cursor: pointer;<br />
padding: 10px 20px;<br />
background-repeat: no-repeat;<br />
/* The following two rules are fallbacks, in case<br />
the browser does not support multiple backgrounds. */<br />
background-position: bottom left;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png');<br />
/* Multiple backgrounds version. The background images<br />
are defined individually in color classes */<br />
background-position: bottom left, top right, 0 0, 0 0;<br />
background-clip: border-box;<br />
/* Applying a default border raidus of 8px */<br />
-moz-border-radius: 8px;<br />
-webkit-border-radius: 8px;<br />
border-radius: 8px;<br />
/* A 1px highlight inside of the button */<br />
-moz-box-shadow: 0 0 1px #fff inset;<br />
-webkit-box-shadow: 0 0 1px #fff inset;<br />
box-shadow: 0 0 1px #fff inset;<br />
/* Animating the background positions with CSS3 */<br />
/* Currently works only in Safari/Chrome */<br />
-webkit-transition: background-position 1s;<br />
-moz-transition: background-position 1s;<br />
transition: background-position 1s;<br />
}<br />
<br />
.button:hover {<br />
/* The first rule is a fallback, in case the browser<br />
does not support multiple backgrounds<br />
*/<br />
background-position: top left;<br />
background-position: top left, bottom right, 0 0, 0 0;<br />
}<br />
<br />
.button:active {<br />
/* Moving the button 1px to the bottom when clicked */<br />
bottom: -1px;<br />
}<br />
/* The three buttons sizes */<br />
.button.big {<br />
font-size: 30px;<br />
}<br />
<br />
.button.medium {<br />
font-size: 18px;<br />
}<br />
<br />
.button.small {<br />
font-size: 13px;<br />
}<br />
/* A more rounded button */<br />
.button.rounded {<br />
-moz-border-radius: 4em;<br />
-webkit-border-radius: 4em;<br />
border-radius: 4em;<br />
}<br />
/* Defining four button colors */<br />
/* BlueButton */<br />
.blue.button {<br />
color: #0f4b6d !important;<br />
border: 1px solid #84acc3 !important;<br />
/* A fallback background color */<br />
background-color: #48b5f2;<br />
/* Specifying a version with gradients according to */<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'),<br />
-moz-radial-gradient(    center bottom, circle,<br />
rgba(89,208,244,1) 0,rgba(89,208,244,0) 100px),<br />
-moz-linear-gradient(#4fbbf7, #3faeeb);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'),<br />
-webkit-gradient(    radial, 50% 100%, 0, 50% 100%, 100,<br />
from(rgba(89,208,244,1)), to(rgba(89,208,244,0))),<br />
-webkit-gradient(linear, 0% 0%, 0% 100%, from(#4fbbf7), to(#3faeeb));<br />
}<br />
<br />
.blue.button:hover {<br />
background-color: #63c7fe;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'),<br />
-moz-radial-gradient(    center bottom, circle,<br />
rgba(109,217,250,1) 0,rgba(109,217,250,0) 100px),<br />
-moz-linear-gradient(#63c7fe, #58bef7);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'),<br />
-webkit-gradient(    radial, 50% 100%, 0, 50% 100%, 100,<br />
from(rgba(109,217,250,1)), to(rgba(109,217,250,0))),<br />
-webkit-gradient(linear, 0% 0%, 0% 100%, from(#63c7fe), to(#58bef7));<br />
}<br />
/* Green Button */<br />
.green.button {<br />
color: #345903 !important;<br />
border: 1px solid #96a37b !important;<br />
background-color: #79be1e;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -moz-radial-gradient(center bottom, circle, rgba(162,211,30,1) 0,rgba(162,211,30,0) 100px),-moz-linear-gradient(#82cc27, #74b317);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgba(162,211,30,1)), to(rgba(162,211,30,0))),-webkit-gradient(linear, 0% 0%, 0% 100%, from(#82cc27), to(#74b317));<br />
}<br />
<br />
.green.button:hover {<br />
background-color: #89d228;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -moz-radial-gradient(center bottom, circle, rgba(183,229,45,1) 0,rgba(183,229,45,0) 100px),-moz-linear-gradient(#90de31, #7fc01e);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgba(183,229,45,1)), to(rgba(183,229,45,0))),-webkit-gradient(linear, 0% 0%, 0% 100%, from(#90de31), to(#7fc01e));<br />
}<br />
/* Orange Button */<br />
.orange.button {<br />
color: #693e0a !important;<br />
border: 1px solid #bea280 !important;<br />
background-color: #e38d27;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -moz-radial-gradient(center bottom, circle, rgba(232,189,45,1) 0,rgba(232,189,45,0) 100px),-moz-linear-gradient(#f1982f, #d4821f);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgba(232,189,45,1)), to(rgba(232,189,45,0))),-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f1982f), to(#d4821f));<br />
}<br />
<br />
.orange.button:hover {<br />
background-color: #ec9732;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -moz-radial-gradient(center bottom, circle, rgba(241,192,52,1) 0,rgba(241,192,52,0) 100px),-moz-linear-gradient(#f9a746, #e18f2b);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgba(241,192,52,1)), to(rgba(241,192,52,0))),-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9a746), to(#e18f2b));<br />
}<br />
<br />
.gray.button {<br />
color: #525252 !important;<br />
border: 1px solid #a5a5a5 !important;<br />
background-color: #a9adb1;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -moz-radial-gradient(center bottom, circle, rgba(197,199,202,1) 0,rgba(197,199,202,0) 100px),-moz-linear-gradient(#c5c7ca, #92989c);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgba(197,199,202,1)), to(rgba(197,199,202,0))),-webkit-gradient(linear, 0% 0%, 0% 100%, from(#c5c7ca), to(#92989c));<br />
}<br />
<br />
.gray.button:hover {<br />
background-color: #b6bbc0;<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -moz-radial-gradient(center bottom, circle, rgba(202,205,208,1) 0,rgba(202,205,208,0) 100px),-moz-linear-gradient(#d1d3d6, #9fa5a9);<br />
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8rG1SjGbi0LnIdWBiq_6VtojlkMkQIqrZ02LoqN71pq1RJcNT5YJ3EU7b99dv7rFLMGShjLLLABqPK9qnpp91Ak0IG1giolZsIrX_ex8-8-I-ayqjcarGvLUCgnRDI5xFct9tmQRIPXM/s1600/helperblogger-button_bg.png'), -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 100, from(rgba(202,205,208,1)), to(rgba(202,205,208,0))),-webkit-gradient(linear, 0% 0%, 0% 100%, from(#d1d3d6), to(#9fa5a9));<br />
}

Buton Html Kodlarını Eklemek Click Blogger;

Aşağıda gördüğümüz kodlardan hangi Boyut rengi İstiyorsanız ona AIT kodu, butonun görünmesini istediginiz Yere html modundayken yapıştırıyoruz ettik.

1. Big Buton Click Html Kodları (Buton Rengine Gore Bir kod Your Language)

& Lt; a href = " Buton Linki Buraya "class =" butonuna büyük mavi "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna büyük yeşil "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna büyük portakal "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna büyük gri "& gt; Buton Metni & lt; / a & gt;

2. Orta Buton Click Html Kodları ( Buton Rengine Gore Bir kod Your Language )

& Lt; a href = " Buton Linki Buraya "class =" düğme mavi orta "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonu yeşil, orta "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna turuncu orta "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonu gri orta "& gt; Buton Metni & lt; / a & gt;

3. Küçük Buton Click Html Kodları ( Buton Rengine Gore Bir kod Your Language )

a href = " Buton Linki Buraya "class =" butonuna küçük mavi "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna küçük yeşil "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna küçük turuncu "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" butonuna küçük gri "& gt; Buton Metni & lt; / a & gt;

4. Küçük Yuvarlak Buton Click Html Kodları ( Buton Rengine Gore Bir kod Your Language )

& Lt; a href = " Buton Linki Buraya "class =" button küçük mavi yuvarlak "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" button küçük yeşil yuvarlak "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" button küçük turuncu yuvarlak "& gt; Buton Metni & lt; / a & gt;
& Lt; a href = " Buton Linki Buraya "class =" düğmesi küçük ve gri yuvarlak "& gt; Buton Metni & lt; / a & gt;

Kodlar İçinde Düzenlenmesi Gereken Bölümler;

Buton Linki Buraya; Yazan Kisima buton linkini ekleyın.
Buton Metni; Olan Kisima imkb bağlantı verdiğiniz buton metnini ekleyın.

Örnek Olarak;

& Lt; a href = " http://etralibela-61.blogspot.com/ "class =" düğmesi küçük ve gri yuvarlak "& gt; Bilgi Cafem 61 & lt; / a & gt;

Delice Takip Edin
Pinterest Facebook Twitter
© by bilgicafem61
Aşağıda Yorum Toplam Sorularinizi Bırakabilirsiniz ve ...

Balon Efektli CSS Blogger Buton Yapımı

Hepimiz blogumuzda Zaman Zaman izle, demo Görünüm, indir, bağlan Gibi farkli amaçlar Click butonlar kullanıyoruz.Bugün sizlere farkli ...

Devamı »

Teknik Elektrik

JavaScript Combobox Menü Yapımı

Blogger İçin JavaScript Scrollbar Butonları

Blogger JavaScript Hareketli Buton Scripti

Blogger İçin Klasik Drop Down CSS3 Açılır Menü Eklentisi

Blogger İçin CSS3 Açılır Multi Level Menü

CSS Çember Düğme Oluşturmak

Balon Efektli CSS Blogger Buton Yapımı

Popüler Yayınlar

Blog Arşivi