[]
materialize.css nin bozduğu checkbox
codepen.io dan bir slide switch buldum çohoş :
codepen.io
yalnız bunu materialize.css ile kullanınca çakılıyor. kullandığım hazır html template de materialize olmadan çalışmıyor. neyi değiştirmem gerekir ki ikisi bir arada huzur içinde çalışsın?
codepen.io
yalnız bunu materialize.css ile kullanınca çakılıyor. kullandığım hazır html template de materialize olmadan çalışmıyor. neyi değiştirmem gerekir ki ikisi bir arada huzur içinde çalışsın?
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
position: absolute;
opacity: 0;
pointer-events: none;
}
böyle bir şey var materialize'da. buradaki pointer-events'i ezmen lazım, o bozuyor. bir de label'ın before var, onun ezilmesi lazım. aşağıdaki content'i ezmen lazım yani sanırım.
[type="checkbox"]+label:before, [type="checkbox"]:not(.filled-in)+label:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 18px;
z-index: 0;
border: 2px solid #5a5a5a;
border-radius: 1px;
margin-top: 2px;
-webkit-transition: .2s;
transition: .2s;
}
position: absolute;
opacity: 0;
pointer-events: none;
}
böyle bir şey var materialize'da. buradaki pointer-events'i ezmen lazım, o bozuyor. bir de label'ın before var, onun ezilmesi lazım. aşağıdaki content'i ezmen lazım yani sanırım.
[type="checkbox"]+label:before, [type="checkbox"]:not(.filled-in)+label:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 18px;
z-index: 0;
border: 2px solid #5a5a5a;
border-radius: 1px;
margin-top: 2px;
-webkit-transition: .2s;
transition: .2s;
}
- lemmiwinks
(07.03.18 21:46:27)
tespitiniz çok doğru, bozan pointer-events.
.fixed tagı ile pointer-events i auto yapmış bazı kullanıcılar.
çözümünüzü bir deneyeceğim şimdi.
.fixed tagı ile pointer-events i auto yapmış bazı kullanıcılar.
çözümünüzü bir deneyeceğim şimdi.
- o kadar da degil aga (10.03.18 13:48:02)
1
