Merhaba,
HTML ve CSS ile ilgileniyorum,
Site içierisinde bootstrap kolon yapısı kullanıyorum ve kolonlardan bir tanesinin üzerine gelince blur almasını, sonrada kolonun yatayda ve dikeyde ortada olacak şekilde üzerine buton gelmesini istiyorum,
fakat buton blurlanmayacak. Dış kaynakları incelediğim zaman butonu absolute yaptıkları için risponsive yapısını bozuyor ve bazıları butonun blursuz olmasını sağlayamıyor,
Not: Javascript kullanmadan css ile yapmamız gerekiyor,
Yardımcı olabilir misiniz,
CSS ile Animasyonlu Div Yapımı ?
4
●52
- 01-03-2021, 21:22:361 adet relative div, 2 adet position absoluteli div gerek. Bu 2 absoluteli divin top right bottom lefti 0lanacak ve bu 2 absoluteli divin birinin blur olmasını diğerinin blur olmamasını ve içerisinde buton olmasını sağlarsınız. Butonun olduğu divin z-indexi blur olan divden büyük olur. Yap dersen ücreti dahilinde. Ama yeterli ipucunu verdiğimi düşünüyorum. Saygılar
- 01-03-2021, 21:35:23Öncelikle bir bütçeye sahip değilim ve fikir yardımı almak için konu açtım,
<divclass="row">
<divclass="col-md-4">
<imgsrc=""alt="">
<hr>
<h3>başlık</h3>
<hr>
<divclass="icerik">
<p> Lorem, ipsum dolor sit amet consectetur adipisicing elit. Officiis sapiente ullam quas iste voluptatum nisi at non eum sequi blanditiis quaerat, voluptatem id nostrum aperiam sunt maiores eius fugit soluta?</p>
</div>
</div>
</div>
yapı yukarıdaki gibi olup, blur vermek istediğim div direk col-md-4 olacak,
tahmin ettiğiniz üzere yan yana 2 adet daha 4 lü kolon var,
display none kullanıp col-md-4 e hover ile gelip blur verdikten sonra absolute kullanmadan divin ortasına buton getirmek isiyorum ve responsive yapısı bozulmamalı,
absolute kullanmadan yapabilmem için fikir verebilirseniz sevinirim çünkü absolute kullanarak yapabilyorum, - 01-03-2021, 21:55:03Buton gözüküyor ama pointer-events:none; dediğim için muhtemelen çalışmayacaktır. Bunu demezsem de butonun üstüne geldiğinde bulanıklık kayboluyor.
https://jsfiddle.net/x75nb6af/

- 01-03-2021, 23:08:15Öncelikle istediğim gibi başardım fakat yeni bir sorun ile karşı karşıyayım, absolute kullanmak zorunda kaldım, dediğim gibi colonlar yan yana ve birinci kolonda butonu ortalama işlemi yapınca responsive bozuluyor,
ben kendim 3000 genişlilk monitör kullanıyorum ve genel internet kullanıcıları 1920 kullandığı için ekranı küçülttüğümde buton colon içinde kalmıyor artık body'e aitmiş gibi davranıyor.
Absolute hali ile bu butonu bulunduğu kolonun genişlik ve yükseklik sınırlarına zorlama işlemi yapabilir miyiz?
