Перейти к публикации

Как сделать скроллинг внутри статической страницы7


D_Moon

Рекомендованные сообщения

Ситуация такая.

Не умещается таблица результатов в окно статической страницы http://wrc-info.ru/european-rally-championship-standings.html

Перекраивать дизайн и убирать правую колонку нежелательно. Тем более, что я не знаю как это сделать только применительно к одной этой страницы.

Как можно реализовать внутри поля главного блока скроллинг?

Ссылка на сообщение
Поделиться на других сайтах

Почему бы вам не сделать это все дело в popup окне, а на странице сделать кнопку *просмотреть результаты*? Думаю для вас лучшее решение.

Ссылка на сообщение
Поделиться на других сайтах

oveflow-x:auto;

спасибо, помогло. Единственное, как сделать, чтобы скроллинг был и сверху и сниу? или хотя бы просто сверху?

Почему бы вам не сделать это все дело в popup окне, а на странице сделать кнопку *просмотреть результаты*? Думаю для вас лучшее решение.

Надо подумать, может быть вы правы. Насколько сложно это реализовать новичку? может есть какой-нибудь пример? Как бы только человек не растерялся не увидев самой таблицы,

Ссылка на сообщение
Поделиться на других сайтах

Почему бы вам не сделать это все дело в popup окне, а на странице сделать кнопку *просмотреть результаты*? Думаю для вас лучшее решение.

Надо подумать, может быть вы правы. Насколько сложно это реализовать новичку? может есть какой-нибудь пример? Как бы только человек не растерялся не увидев самой таблицы,


------HTML-------


<a href="javascript:PopUpShow()">Показать окно</a>


<!--Окно открыто-->

<div class="popup_opened" id="window">

	<div class="popup_inside">

		 Текст (в вашем случае таблица) внутри popup-окна

		<a href="javascript:PopUpHide()">Скрыть окно</a>

	</div>

</div>


------CSS-------

.popup_opened {

	width:100%;

	min-height:100%;

	background-color: rgba(0,0,0,0.5);

	overflow:hidden;

	position:fixed;

	top:0px;

}


.popup_opened .popup_inside {    

	margin: 250px auto 0px auto; // Настройте отступы под себя, значения по часовой - верх, справа, низ, слева

	width:800px; // Задайте необходимую ширину

	height: 100%; // Не изменять

	padding: 10px; // Отступ внутри от краев окна

	background-color: #c5c5c5; // Цвет фона окна	

}


------JS-------

<script>

$(document).ready(function(){

	PopUpHide();

});

function PopUpShow(){

	$("#window").show();

}

function PopUpHide(){

	$("#window").hide();

}

</script>

Дизайн окна можете сделать уже как вам вздумается. Я вам показал реализацию. Но помните, свойства типа border-radius и box-shadow нужно указывать для всех типов браузеров.

Ссылка на сообщение
Поделиться на других сайтах

Почему бы вам не сделать это все дело в popup окне, а на странице сделать кнопку *просмотреть результаты*? Думаю для вас лучшее решение.

Надо подумать, может быть вы правы. Насколько сложно это реализовать новичку? может есть какой-нибудь пример? Как бы только человек не растерялся не увидев самой таблицы,


------HTML-------


<a href="javascript:PopUpShow()">Показать окно</a>


<!--Окно открыто-->

<div class="popup_opened" id="window">

	<div class="popup_inside">

		 Текст (в вашем случае таблица) внутри popup-окна

		<a href="javascript:PopUpHide()">Скрыть окно</a>

	</div>

</div>


------CSS-------

.popup_opened {

	width:100%;

	min-height:100%;

	background-color: rgba(0,0,0,0.5);

	overflow:hidden;

	position:fixed;

	top:0px;

}


.popup_opened .popup_inside {	

	margin: 250px auto 0px auto; // Настройте отступы под себя, значения по часовой - верх, справа, низ, слева

	width:800px; // Задайте необходимую ширину

	height: 100%; // Не изменять

	padding: 10px; // Отступ внутри от краев окна

	background-color: #c5c5c5; // Цвет фона окна	

}


------JS-------

<script>

$(document).ready(function(){

	PopUpHide();

});

function PopUpShow(){

	$("#window").show();

}

function PopUpHide(){

	$("#window").hide();

}

</script>

Дизайн окна можете сделать уже как вам вздумается. Я вам показал реализацию. Но помните, свойства типа border-radius и box-shadow нужно указывать для всех типов браузеров.

спасибо) только я не совсем понял. Разве можнов ставлять ява скрипт в текст статической страницы. Просто не хочется вставлять его в шаблон и перегружать остальные страницы лишним кодом.

Ссылка на сообщение
Поделиться на других сайтах

спасибо) только я не совсем понял. Разве можнов ставлять ява скрипт в текст статической страницы. Просто не хочется вставлять его в шаблон и перегружать остальные страницы лишним кодом.

Ява-скрипт нужно тыкать в main.tpl между [head]...[/head] :)

Ссылка на сообщение
Поделиться на других сайтах

спасибо) только я не совсем понял. Разве можнов ставлять ява скрипт в текст статической страницы. Просто не хочется вставлять его в шаблон и перегружать остальные страницы лишним кодом.

Ява-скрипт нужно тыкать в main.tpl между [head]...[/head] :)

вот я про то и говорю, нехочется вставлять дополнительный скрипт ради пары страниц. И так уже очень много понавставлял и многие сервисы проверки скорости страниц ругаются на это, так как снижается скорость загрузки.

Но все равно большое вам спасибо, буду думать как лучше поступить)

Ссылка на сообщение
Поделиться на других сайтах

Архивировано

Эта тема находится в архиве и закрыта для публикации сообщений.

×
×
  • Создать...