Ширина рядов неожиданнаяHtml

Программисты Html
Ответить
Anonymous
 Ширина рядов неожиданная

Сообщение Anonymous »

В одном из наших подразделений используется веб-сайт, на котором появляется баннер логотипа, когда кто-то прокручивается. Они смогли сделать это на сайте WordPress, используя плагин, за который они не платят, поэтому я не могу обновить его. Немного загвоздину. Это в основном статическая страница, которую я решил имитировать сайт, используя HTML, CSS и JavaScript (OW ... и Bootstrap, если подумать ... не совсем уверен, почему). < /P>
В любом случае ... Я застрял на появном баннере. Похоже, это отлично, но я не могу заставить его быть таким же широким, как и другой / элементы с контентом. Он выглядит слишком широко или слишком узким.

Код: Выделить всё

window.onscroll = function() { scrollFunction()};

function scrollFunction(){
console.log(document.documentElement.scrollTop);
if (document.documentElement.scrollTop > 100){
console.log('groter');
document.getElementById("stayontop").classList.add('show');
document.getElementById("stayontop").classList.remove('hide');
}else{
console.log('kleiner')
document.getElementById("stayontop").classList.remove('show');
document.getElementById("stayontop").classList.add('hide');
}
};< /code>
#stayontop{
position: fixed;
z-index: 2;
width: 100%;
background-color: red;
opacity: 50%;
}
#stayontop.hide{
display: none;
}
#stayontop.show{
display: block;
}
.short { background-color: yellow;}
.long { background-color: green;}< /code>

Stay on top
Nice and short

[A very long piece of tekst to force scrollbar. Snipper away for posting here]

< /code>
< /div>
< /div>
< /p>
Как видите: просто контейнер с 3 строками. Последние 2 видны по умолчанию и заполняют ширину контейнера. Первый  
имеет идентификатор "stainontop" и класс "hide" .
В CSS, позиция и z-индекс должны держать Div в верхней части страницы, в то время как остальные прокручивают под ней. Кажется, работает.
классы "скрыть" и "show" переключайте видимость. Это, кажется, тоже работает. Работает, как и ожидалось. /> @daniel
Спасибо ... ты прав. Мне уже было интересно, что случилось с шириной 100%. Это не решило мою проблему: теперь Div шире, чем другие элементы div .

Подробнее здесь: https://stackoverflow.com/questions/795 ... unexpected
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»