Как сделать фиксированный размер канваса?
07 июля 2017 22:54
Как сделать фиксированный размер канваса, который бы изменялся в зависимости от ширины и высоты окна браузера, как в этом примере - https://playcanv.as/p/kx8rLnM1/
Зарание спасибо
Зарание спасибо
http://vg3d.ru
09 июля 2017 08:49
Мда, сообщество конечно у вас "активное"….)
Решение очень простое - https://m.habrahabr.ru/post/187406/
Решение очень простое - https://m.habrahabr.ru/post/187406/
http://vg3d.ru
09 июля 2017 23:43
Привет)
Да нормальное, просто видимо заняты многие)
А я вопрос видел, но он слишком простой был ,я думал ты сам додумаешься)
Вообще если нужно "как тут", то просто лезь в код и бери прямо "как там":
Тебе нужен класс fill-mode-KEEP_ASPECT. Его фишка в том, что он задает ширину на всю ширину родительского элемента, а высота считается автоматически. При этом сам канвас заранее содержит свои размере в HTML:
А то что он на фулл скрине не на всю ширину сделано за счёт следующего CSS:
Да нормальное, просто видимо заняты многие)
А я вопрос видел, но он слишком простой был ,я думал ты сам додумаешься)
Вообще если нужно "как тут", то просто лезь в код и бери прямо "как там":
#application-canvas {
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#application-canvas.fill-mode-NONE {
margin: auto;
}
#application-canvas.fill-mode-KEEP_ASPECT {
width: 100%;
height: auto;
margin: 0;
}
#application-canvas.fill-mode-FILL_WINDOW {
width: 100%;
height: 100%;
margin: 0;
}
Тебе нужен класс fill-mode-KEEP_ASPECT. Его фишка в том, что он задает ширину на всю ширину родительского элемента, а высота считается автоматически. При этом сам канвас заранее содержит свои размере в HTML:
<canvas id="application-canvas" tabindex="0" width="1516" height="853" class="fill-mode-KEEP_ASPECT" style=""></canvas>
А то что он на фулл скрине не на всю ширину сделано за счёт следующего CSS:
@media screen and (min-aspect-ratio: 1280/720){
#application-canvas.fill-mode-KEEP_ASPECT {
width: auto;
height: 100%;
margin: 0 auto;
}
}
10 июля 2017 03:17
Ну это в общем то ни как не связано с фраймворком B4W,
это скорее вопрос по CSS и верстке адаптивной или нет итд..
Канвас один или два или три вместе или по отдельности , это обычный DOM элемент и свойства его задаются через CSS по отношению к документу в котором его размещаешь.
ну выше все уже ответили…
это скорее вопрос по CSS и верстке адаптивной или нет итд..
Канвас один или два или три вместе или по отдельности , это обычный DOM элемент и свойства его задаются через CSS по отношению к документу в котором его размещаешь.
ну выше все уже ответили…
Денис