Viewport Genişliğini (vw) kaydırma çubuğu olmadan hesaplamak mümkün mü?

Başlıkta belirtildiği gibi, vw kaydırma çubukları olmadan yalnızca css olarak hesaplanabiliyor mu? Örneğin, ekranımın genişliği 1920px genişliğindedir. vw, 1920px değerini döndürür. Ama benim gerçek vücut genişliğim sadece 1903px gibi bir şey.Viewport Genişliğini (vw) kaydırma çubuğu olmadan hesaplamak mümkün mü?

1903px değerini yalnızca css ile (yalnızca body doğrudan çocukları için değil) almamın bir yolu var mı, yoksa bunun için JavaScript'e kesinlikle ihtiyacım var mı? the specs göre

kaynak

2015-11-09 Marten Zander

ama ... kaydırma çubuğu görünümün genişliğine dahil değil !? – Danield

@Danield, genellikle değil. Öyleyse, genellikle kaydırma yapılmadığında yok olur, bu yüzden soru oldukça anlamsızdır. –

@Danield üzgünüm, myquestion'u güncelledim –

, görüntü alanı göreceli uzunluk birimleri (onlar yoktur varsayalım ve aslında) dikkate kaydırma çubukları yapmayız.

Amaçlanan davranışınız ne olursa olsun, bu birimleri kullanırken kaydırma çubuklarını dikkate alamazsınız.

kaynak

2015-11-09 10:06:23

Üzgünüm, myquestion'u güncelledim –

Yine, 'vw', spec için herhangi bir kaydırma çubuğunun varlığından haberdar değil. Yani onları dikkate alamazsın. –

Spesifikasyonlara göre vw kaydırma çubuğunun genişliğini alır UNLESS, taşma otomatik olarak açık, daha sonra vw değeri için "gizli" gibi çalışır. Yani sayfa taşması gerekiyorsa, "kaydır" olarak ayarlayın. Taşma-x & taşma-y ile görüntülenecek kaydırma çubuğunu seçersiniz. – Kulvar

Webkit tarayıcıları, kaydırma çubuklarını hariç tutar, diğerlerini ise geri dönen genişlikte içerir. Bu elbette ki sorunlara yol açabilir: örneğin, aams ile birlikte dinamik olarak oluşturulmuş içerik dinammik olarak yükseklik ekliyorsanız, sayfa görselleştirmesi sırasında Safari bir mizanpajdan diğerine geçebilir ... Tamam, bu sık sık olmaz, ancak farkında olmak için bir şey. Mobil cihazlarda, daha az sorun, kaydırma çubuklarının genel olarak gösterilmemesine neden olur.

width = $('body').innerWidth();

önceden ayarlanmış olan:

Sorununuz olarak bildiğim kadarıyla, her tarayıcıda çubukları olmadan exacly görüntü alanı genişliğini hesaplamak ise, söylenir

, iyi bir yöntem şudur

body { 
    margin:0; 
    }

kaynak

2015-11-09 11:28:14 holden

Bunu yapmanın bir yolu kalk. Bildiğim kadarıyla,% 100 kaydırma çubukları dahil genişliğidir. Bu nedenle:

100vw eksi kaydırma çubuğunun genişliğini elde edersiniz.

Sen örneğin görüntü alanının% 50'si olan bir kare isterseniz (eksi scollbar genişliğinin% 50)

.box { 
    width: calc(50vw - ((100vw - 100%)/2)) 
    height: 0 
    padding-bottom: calc(50vw - ((100vw - 100%)/2)) 
}

kaynak

2016-01-19 19:02:40

Bazı sebeplerden dolayı, bu türden başka bir soruya verilen cevaplara rağmen, benim için en sorunsuz şekilde çalışan bu cevap oldu - o kadar mükemmel ve hızlıydı ki yarısı büyük bir "gotcha" bekliyordum! – Daniel

Bu benim için mükemmel çalıştı. Teşekkürler! – Husky

Bu harika, ancak maalesef sadece boyutlandırmakta olduğunuz elemanın 'bedenin' doğrudan çocuğu ya da 'beden' ile aynı genişliğe sahip bir eleman olması durumunda (aksi takdirde '100%' yanlış öğenin genişliğine değinecektir) çalışır. . Bu durumda sadece yüzdeleri kullanabilirsiniz. Bir şey özlemediğim sürece? – Nateowami

vw ünite almaz, hem de yükseklik ile yapabilirsiniz overflow-y kaydırma çubuğu, overflow-yauto olarak ayarlandığında dikkate alınmalıdır.

overflow-y: scroll; olarak değiştirin ve vw birimi kaydırma çubuğu olmayan görünüm penceresi olacaktır.

Sadece dikkate almak için olumsuz. İçerik ekrana sığarsa, kaydırma çubuğu yine de gösterilir. Olası çözüm, javascript'te auto'dan scroll'a değiştirmektir.

kaynak

2018-02-07 10:26:04

Viewport Genişliğini (vw) kaydırma çubuğu olmadan hesaplamak mümkün mü?

cevap

İlgili konular