{"version":"1.0","provider_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","provider_url":"https:\/\/fatihsoysal.com\/blog","author_name":"Fatih Soysal","author_url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/","title":"CSS ile Sadece Kayd\u0131rma \u00dcst\u00fc Ba\u015fl\u0131k Hover Efekti","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"x3LsULYhtn\"><a href=\"https:\/\/fatihsoysal.com\/blog\/css-ile-sadece-kaydirma-ustu-baslik-hover-efekti\/\">CSS ile Sadece Kayd\u0131rma \u00dcst\u00fc Ba\u015fl\u0131k Hover Efekti<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/fatihsoysal.com\/blog\/css-ile-sadece-kaydirma-ustu-baslik-hover-efekti\/embed\/#?secret=x3LsULYhtn\" width=\"600\" height=\"338\" title=\"&#8220;CSS ile Sadece Kayd\u0131rma \u00dcst\u00fc Ba\u015fl\u0131k Hover Efekti&#8221; &#8212; Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" data-secret=\"x3LsULYhtn\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script>\n\/*! This file is auto-generated *\/\n!function(d,l){\"use strict\";l.querySelector&&d.addEventListener&&\"undefined\"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!\/[^a-zA-Z0-9]\/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret=\"'+t.secret+'\"]'),o=l.querySelectorAll('blockquote[data-secret=\"'+t.secret+'\"]'),c=new RegExp(\"^https?:$\",\"i\"),i=0;i<o.length;i++)o[i].style.display=\"none\";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute(\"style\"),\"height\"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):\"link\"===t.message&&(r=new URL(s.getAttribute(\"src\")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener(\"message\",d.wp.receiveEmbedMessage,!1),l.addEventListener(\"DOMContentLoaded\",function(){for(var e,t,s=l.querySelectorAll(\"iframe.wp-embedded-content\"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute(\"data-secret\"))||(t=Math.random().toString(36).substring(2,12),e.src+=\"#?secret=\"+t,e.setAttribute(\"data-secret\",t)),e.contentWindow.postMessage({message:\"ready\",secret:t},\"*\")},!1)))}(window,document);\n<\/script>\n","description":"Merhaba, Fatih Soysal burada! Bu yaz\u0131da, CSS kullanarak g\u00f6rsel i\u00e7eriklerin \u00fczerine gelindi\u011finde yukar\u0131dan kayan bir ba\u015fl\u0131k efekti nas\u0131l olu\u015fturulaca\u011f\u0131n\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu teknik, web sitenizin g\u00f6rsel \u00e7ekicili\u011fini art\u0131rmak ve kullan\u0131c\u0131 deneyimini iyile\u015ftirmek i\u00e7in m\u00fckemmel bir y\u00f6ntemdir. \u00d6ncelikle, temel HTML yap\u0131s\u0131n\u0131 ve ard\u0131ndan CSS kodlar\u0131n\u0131 inceleyece\u011fiz. Sonras\u0131nda, kodu nas\u0131l \u00f6zelle\u015ftirebilece\u011finizi ve farkl\u0131 varyasyonlar\u0131n\u0131 nas\u0131l olu\u015fturabilece\u011finizi g\u00f6rece\u011fiz. Ayr\u0131ca, baz\u0131 ipu\u00e7lar\u0131 ve p\u00fcf noktalar\u0131 payla\u015faca\u011f\u0131m. Bu y\u00f6ntem sayesinde, JavaScript'e gerek kalmadan, sadece CSS kullanarak etkileyici bir hover efekti elde edebileceksiniz. Bu, web sitenizin performans\u0131n\u0131 olumlu etkileyecektir."}