Странное разрешение изображения в CSS

Просто хотите, чтобы изображение было фоном, Исправьте, где необходимо. Спасибо!Странное разрешение изображения в CSS

EDIT:

div { 
color: #13eee6; 
font: 30px Roboto; 
position: absolute; 
bottom: 0; 
left: 0;

}

PHP:

<!DOCTYPE html> 
<html> 
    <body> 
    <!-- 1. The <iframe> (and video player) will replace this <div> tag. --> 
    <div id="player"></div> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 

    <script> 
    // 2. This code loads the IFrame Player API code asynchronously. 
    var tag = document.createElement('script'); 

    tag.src = "https://www.youtube.com/iframe_api"; 
    var firstScriptTag = document.getElementsByTagName('script')[0]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

    // 3. This function creates an <iframe> (and YouTube player) 
    // after the API code downloads. 
    var player; 
    function onYouTubeIframeAPIReady() { 
    player = new YT.Player('player', { 
     height: '1', 
     width: '1', 
     //videoId: 'M7lc1UVf-VE', 
     playerVars: 
     { 
     listType:'playlist', 
     list: 'PLsVV8G4dmXyE2mSm3ZSz_AcNVduhw2ZwM' 
     }, 
     events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onPlayerStateChange, 

     } 
    }); 
    } 

// console.log(player); 



    // 4. The API will call this function when the video player is ready. 
    function onPlayerReady(event) { 
    event.target.playVideo(); 

    $('.title').text(event.target.getVideoData().title); 

    } 

    // 5. The API calls this function when the player's state changes. 
    // The function indicates that when playing a video (state=1), 
    // the player should play for six seconds and then stop. 
    var done = false; 
    function onPlayerStateChange(event) { 
    if (event.data == YT.PlayerState.PLAYING && !done) { 
     setTimeout(stopVideo, 6000); 
     done = true; 
    } 
    console.log(event); 
    if ((event.data == -1)) { 
     $('.title').text(event.target.getVideoData().title); 
    } 
    }  


    function stopVideo() { 
    player.stopVideo(); 
    } 
</script> 

<div class="title"> </div> 
<link rel="stylesheet" type="text/css" href="style.css">

CSS:

body { 
    background-image: url("http://i.imgur.com/z6fgaW8.png"); 
    background-color: #cccccc; 
    background-size: 100% 100%; 
    background-repeat: no-repeat; 
} 

div { 
    color: #13eee6; 
    font: 30px Roboto; 
}

Веб-сайт: http://darklegionrp.byethost24.com/ Должен быть образный фон, 1,1 видеопроигрыватель (без возможности просмотра) для воспроизведения фоновой музыки. Музыка находится в плейлисте. JQuery получает имя текущего видео в список воспроизведения, и записывает его на экране, название песни должно быть наверх изображения, где он говорит: «Nightcore - Герои»

источник

2015-11-19 Robinlemon

какой "образ"? Фон в вашем css? –

Вы используете background-size: 100% 100%; попытаться изменить это background-size: cover;, когда я попытался Чтобы изменить его в консоли Chrome, он увеличил изображение.

Вашего код будет:

body { 
    background-image: url("http://i.imgur.com/z6fgaW8.png"); 
    background-color: #cccccc; 
    background-size: cover;/* Note the change here */ 
    background-repeat: no-repeat; 
} 

div { 
    color: #13eee6; 
    font: 30px Roboto; 
}

для достойной проверки объяснения here

Надеется, что это помогает!

источник

2015-11-19 21:22:55 Simplicity

Thankyou <3 Надеюсь, что это сработает, D – Robinlemon

inded it does, Thankyou очень для быстрого ответа! – Robinlemon

Надеюсь, что так и не забывайте, что, если вы считаете, что мой ответ правильный, чтобы отметить мой ответ как правильный ответ, чтобы другие люди с одинаковой проблемой могли быстро найти решение @GenaratedPixelz – Simplicity

Размер фона составляет 100% 100%, а высота всего 52 пикселя. Это означает, что высота фонового изображения также будет только 52px.

Установить фон размера на:

background-size: 100%;

источник

2015-11-19 21:23:08 Tazius

Thankyou <3 Надеюсь, что это работает, D – Robinlemon

Странное разрешение изображения в CSS

ответ

Смежные вопросы