2015-08-06 3 views
1

Я пытаюсь создать всплывающее окно, которое будет иметь фиксированную ширину, но динамическую высоту, основанную на размере экрана пользователя. Возможно ли это? Я просмотрел этот сайт, а другие - безрезультатно.Динамическая высота в всплывающем окне JavaScript

Я прочитал вопрос ниже, но мне не нужен размер, основанный на содержании.

Dynamic height for popups depending on content, is it possible?

Я использую всплывающее окно для обучения. Окно авто-размера и расположено на одной стороне экрана и содержит указания о том, как использовать приложение, которое занимает оставшийся бит экрана. Проблема в том, что у нас есть мониторы разного размера с различными разрешениями экрана. К счастью, нам нужно только беспокоиться об IE11.

Вот гигантский отказ от ответственности; Я ничего не знаю о JavaScript, за исключением того, что он существует и может делать то, что мне нужно. Однако я знаю HTML & CSS. Так вот что я получил происходит до сих пор, и я уверен, что это далеко не правильный способ сделать это:

<a href="link.html" onclick="javascript:void window.open('link.html','1429893142534','width=290,height=675,toolbar=0,menubar=0,location=0,status=0,scrollbars=1,resizable=0,left=0,top=0');return false;">Link</a> 

Я попытался полностью опуская высоту, но это не сработало. Высота, которая существует, основана на самом маленьком экране, на котором может работать пользователь, но выглядит довольно глупо с большим разрешением экрана &. Может, что-то, кроме JavaScript, будет работать лучше?

Заранее благодарим за любые ответы!

+0

Вы можете определить высоту/ширину браузера и поместить окно на основе ширины/высоты браузера ... – brso05

+0

Прохладный ... как это работает? Я нашел это, чтобы получить высоту/ширину, но как я могу использовать информацию для размера окна? shewok

+0

Я отправил ответ, который изменит размер всплывающего окна, исходя из того, насколько большой/маленький браузер пользователя ... Просто попробуйте изменить размер своего браузера, и вы увидите, как он изменится, когда вы нажмете ссылку , Вы можете изменить коэффициент масштабирования, просто измените '0.3' на то, что вы хотите, в основном я беру' 30% 'от ширины и' 30% 'от высоты ... – brso05

ответ

2

Вы можете сделать что-то вроде этого:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<body> 
<a href="" onclick="openLink();">Link</a> 
<script> 
    function openLink() 
    { 
     window.open('link.html','1429893142534','width=' + (parseInt(window.innerWidth) * 0.3) + ',height=' + (parseInt(window.innerHeight) * .3) + ',toolbar=0,menubar=0,location=0,status=0,scrollbars=1,resizable=0,left=0,top=0'); 
     return false; 
    } 
</script> 
</body> 
</html> 
+0

Спасибо! Это, безусловно, работает лучше, чем у меня. По какой-то причине я должен умножить более чем на 1 для innerHeight, чтобы получить достаточно высокий уровень. Между моим рабочим столом и ноутбуком существует небольшая разница. Как ни странно, у меньшего экрана на моем ноутбуке больше пространства между нижней частью окна и панелью задач, тогда как окно на моем рабочем столе лежит на панели задач. Тем не менее, намного лучше. Спасибо. – shewok

+0

@shewok ваш радушный рад, что я мог бы помочь! – brso05

1
<a href="link.html" onclick="javascript:void window.open('link.html','1429893142534','scrollbars=1');return false;">Link</a> 

Это должно выполнить ваше требование, как это работает для меня тоже. Для получения дополнительной информации: refer here

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