Resim, gövde öğesinin arka planına sığamıyor Resim

Şu anda burada, xfce kurulumum için düzgün görünümlü bir giriş sayfası yazmaya çalışıyorum.Resim, gövde öğesinin arka planına sığamıyor Resim

Birisi yanlış parola girdiğinde profil resmi ve arka plan görüntüsünün değişmesini istiyorum. Ben şu anda arka plan değiştirir ama background-size: cover; çalıştırmak için javascript ihtiyacım var ekrana sığacak şekilde germek için çalışmıyor.

Geçerli javascript satırı şu an document.body.style.background = " #000000 url('images/bg.gif') no-repeat center fixed"; JQuery bir seçenek değil, neden sorma. Sadece değil.

Lütfen ve teşekkür edin.

kaynak

2016-03-29 realsub

Yeniden oluşturmak için bir yol verin, bir jsfiddle veya bir codepen veya bir şey takdir edilecektir. Css'niz doğruysa, arka plan resmini değiştirmek önemli olmaz. –

Bize neden daha fazla kod göstermiyorsunuz (ör. JSFiddle'da)? –

Gerçekten de jsfiddle'ı düzgün çalışabilseydim, isterdim. – realsub

Arka planın "ekranı doldur" olarak zorlamak için document.body.style.backgroundSize = "cover"'u kullanabilirsiniz.

kaynak

2016-03-29 21:11:55 Stuart

Teşekkür ederim, bu mükemmel çalıştı. Avatarı değiştirmek de mümkün mü? Bu sadece normal bir etiketi. – realsub

@ war10ck Geri kodları kodlama için teşekkürler. @realsub, evet 'src' özniteliğine çok benzer şekilde erişirsiniz, imgObject.setAttribute ('src', 'yol/to/new/avatar.jpg') 'veya' imgObject.src = 'yolu/to/new/avatar.jpg ' – Stuart

Çok teşekkür ederim, html & js belgelerinde tanımlanan avatar konumunu dinlemek için lightdm almaya çalışacağım. Şu anda '/ var dosyasında bir yapılandırma dosyası dinliyor./lib/AccountsService/users/'aşağıdaki yolu kullanarak:' Icon =/var/lib/AccountsService/icons/illidan' Yapılandırmayı dinlememesini ve bunun yerine html'yi kullanmasını nasıl sağlayacağınızı anlayamadık. – realsub

Sayfanızı şekillendirmek ve sınıfları değiştirmek için JS kullanmak için CSS sınıflarını kullanmanız önerilir (çok daha kolay ve bakımı kolay).

document.body.className = 'wrong-password';

ve CSS olurdu:

Yani, senin durumunda, JavaScript gibi bir şey olabilir

<style> 
    .wrong-password { 
     background: #000000 url('images/bg.gif') no-repeat center fixed; 
     background-size: cover; 
    } 
</style>

Ve kolayca daha fazla stilleri ekleyebilir veya hatta çocuk stilini değiştirebilirsiniz (örneğin avatar) gibi, kolayca:

<style> 
    .wrong-password .avatar { 
     display: none; 
    } 

    .wrong-password .some-placeholder { 
     display: block; 
    } 
</style>

kaynak

2016-03-29 21:30:00

Resim, gövde öğesinin arka planına sığamıyor Resim

cevap

İlgili konular