| |
 39.1 Кб |
|
| | Во всплывающей форме образуются две полосы вертикальной прокрутки (скриншот). Тот ползунок, который слева, отражает реальное положение прокручиваемого текста. А правая прокрутка стоит незыблемо и совершенно не нужна. Как избавиться от правой прокрутки?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Настройка</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.simplemodal.js"></script>
<link href="css/modal2.css" rel="stylesheet" type="text/css" />
<script>
function openWindow(module, id){
$('#modalContainer').modal({onShow: function (dialog)
{
$.getJSON('json.php?id='+id+'&module='+module, function(data){
$.each(data, function(key, val){
$("#"+key).val(val);
});
});
}});
};
</script>
</head>
<body>
<div id="modalContainer" style="display:none;">
<?php
echo nl2br(file_get_contents('log.txt'));
?>
</div>
<p><a href="#" onclick="openWindow('dob_tov', '');">Просмотр логов</a></p>
|
Код в файле modal2.css:
#modalContainer {
height: 300px;
width: auto;
left: 50%;
top: 50%;
border: 1px solid blue;
overflow: auto;
overflow-x: hidden;
}
a.modalCloseImg {
background:url(../img/x.png) no-repeat;
width: 25px;
height: 29px;
display: block;
z-index: 3200;
position: absolute;
top: 0px;
right: 0px;
cursor: pointer;
}
|
| |
| |
|
|
| |
|
|
| |
для: Владимир55
(23.05.2013 в 13:06)
| | | не совсем понятно по вашему примеру что есть что. но вообще, для контейнера, у которого прокрутка будет скрыта, нужно прописать в стилях overflow:hidden | |
| |
|
|
| |
|
|
| |
для: psychomc
(23.05.2013 в 14:53)
| | | не совсем понятно по вашему примеру что есть что
По клику на ссылку
<p><a href="#" onclick="openWindow('dob_tov', '');">Просмотр логов</a></p>
|
появляется всплывающее окно, которое наполняется текстом из файла log.txt' (json.php здесь реально не используется и его можно было бы удалить из функции, но я этого не сумел сделать без нарушения работы).
Всплывающее окно служит только для просмотра и закрывается по клику на крестик.
для контейнера, у которого прокрутка будет скрыта, нужно прописать в стилях overflow:hidden
Мне это известно, но реально чего я только ни пробовал - толку нет. | |
| |
|
|
| |
|
|
| |
для: Владимир55
(23.05.2013 в 15:06)
| | | можно в интернете посмотреть, или только локально? | |
| |
|
|
| |
83.3 Кб |
|
| |
для: psychomc
(23.05.2013 в 16:01)
| | | Да, можно в интернете: http://wowa55.pz9.ru/3.php
Файлы во вложении. | |
| |
|
|
| |
|
|
| |
для: Владимир55
(23.05.2013 в 16:36)
| | | такс, для начала исправьте ошибку. у вас на странице два дива с id="modalContainer", так не должно быть. id должен быть уникальным | |
| |
|
|
| |
|
|
| |
для: psychomc
(23.05.2013 в 18:05)
| | | Скорректированный код приведен ниже. Собственно, первоначально я его именно таким и сделал. Тут проблема в том, что прокрутка вообще не возникает, хотя высота контейнера задана (300 рх).
Вот смотрите: http://wowa55.pz9.ru/31.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.simplemodal.js"></script>
<script src='js/jquery.form.js'></script>
<link href="css/modal.css" rel="stylesheet" type="text/css" />
<script>
function openWindow(module, id){
$('#modalContainer').modal({onShow: function (dialog) {
$.getJSON('json.php?id='+id+'&module='+module, function(data){
$.each(data, function(key, val){
$("#"+key).val(val);
});
});
}});
};
</script>
</head>
<body>
<p><a href="#" onclick="openWindow('dob_tov', '');">Просмотр логов</a></p>
<div id="modalContainer" style="display:none;">
<?php
echo nl2br(file_get_contents('log.txt'));
?>
</div>
</body>
</html>
|
| |
| |
|
|
| |
184.1 Кб |
|
| |
для: Владимир55
(23.05.2013 в 19:31)
| | |
<div id="modalContainer" class="modalContainer" style="position: fixed; z-index: 5100; display: block; margin-top: -151px; margin-left: -270.5px; overflow: hidden;">
|
См. аттач
А также попробуйте дописать в скрипт:
***
$('#modalContainer').modal({onShow: function (dialog) {
$.getJSON('json.php?id='+id+'&module='+module, function(data){
$.each(data, function(key, val){
$("#"+key).val(val);
});
});
}}).css('overflow','hidden');
***
|
| |
| |
|
|
| |
|
|
| |
для: Deed
(23.05.2013 в 20:32)
| | | Возможно, что я что-то не так понял, но работает неверно: http://wowa55.pz9.ru/32.php
Код такой:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Настройка</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.simplemodal.js"></script>
<link href="css/modal2.css" rel="stylesheet" type="text/css" />
<script>
$('#modalContainer').modal({onShow: function (dialog) {
$.getJSON('json.php?id='+id+'&module='+module, function(data){
$.each(data, function(key, val){
$("#"+key).val(val);
});
});
}}).css('overflow','hidden');
</script>
</head>
<body>
<div id="modalContainer" class="modalContainer" style="position: fixed; z-index: 5100; display: block; margin-top: -151px; margin-left: -270.5px; overflow: hidden;">
<?php
echo nl2br(file_get_contents('log.txt'));
?>
</div>
<p><a href="#" onclick="openWindow('dob_tov', '');">Просмотр логов</a></p>
|
| |
| |
|
|
| |
164.8 Кб |
|
| |
для: Владимир55
(23.05.2013 в 22:11)
| | | у modalContainer уберите overflow:hidden и всё заработает ===============>>>>>>>>>>>>>> | |
| |
|
|
| |
|
|
| |
для: psychomc
(24.05.2013 в 00:07)
| | | Увы!
При таком раскладе это не всплывающая по клику форма, а просто уменьшенное окно с прокруткой: http://wowa55.pz9.ru/33.php | |
| |
|
|
| |
|
|
| |
для: Владимир55
(24.05.2013 в 01:41)
| | | Да, уберите .css('overflow','hidden') - плагин modal разрывает цепочку вызовов.
Если хотите, дайте мне доступ к серверу, и я приду с работы - сделаю без этого плагина и без джетсона. | |
| |
|
|
| |
|
|
| |
для: Deed
(24.05.2013 в 07:55)
| | | Доступ к акаунту послал в личку. Если письмо не дойдет, то дайте знать. | |
| |
|
|
| |
|
|
| |
для: Владимир55
(24.05.2013 в 10:38)
| | | Друже! Данные получил. Но ща на корпоративе. Займусь завтра утром.
Извини. Жизнь. | |
| |
|
|
|
| |
22.1 Кб |
|
| |
для: Deed
(25.05.2013 в 08:38)
| | | Спасибо, очень интересное решение!
Но, к сожалению, оно не имеет практического значения, поскольку:
1. В Эксплорере прокрутка вообще отсутвтвует (скриншот):
2. Нет возможности закрыть окно, и каким образом реализовать его закрытие мне совершенно непонятно. | |
| |
|
|
| |
76.7 Кб |
|
| |
для: Владимир55
(25.05.2013 в 10:34)
| | | См. аттач
Какая версия IE? | |
| |
|
|
| |
|
|
| |
для: Deed
(25.05.2013 в 10:55)
| | | Восьмая. | |
| |
|
|
| |
|
|
| |
для: Владимир55
(25.05.2013 в 12:00)
| | | http://wowa55.pz9.ru/36.php
Если не сработает, подумаем над вариантами... Хотя, должно работать. | |
| |
|
|
| |
|
|
| |
для: Deed
(25.05.2013 в 12:04)
| | | Кнопочка закрытия появилась и работает, что очень приятно!
А вот прокрутки в ИЕ8 по-прежнему нет... | |
| |
|
|
| |
|
|
| |
для: Владимир55
(25.05.2013 в 12:15)
| | | Обновите страницу. Несколько раз.
http://wowa55.pz9.ru/36.php | |
| |
|
|
| |
|
|
| |
для: Deed
(25.05.2013 в 12:23)
| | | Получилось шикарно! Работает превосходно во всех браузерах! Высший класс!
Большое спасибо! | |
| |
|
|
| |
|
|
| |
для: Владимир55
(25.05.2013 в 12:41)
| | | Кстати, таким вот нехитрым образом:
$(document).ready(function(){
var del_logo = $('ml_code').nextAll().remove();
});
|
можно избавиться от надоедливого логотипа бесплатного хостинга на каждой из ваших страниц.
См. http://wowa55.pz9.ru/36.php | |
| |
|
|
| |
|
|
| |
для: Deed
(25.05.2013 в 20:33)
| | | Спасибо, тоже хороший прием! | |
| |
|
|
| |
|
|
| |
для: Владимир55
(26.05.2013 в 10:51)
| | | Еще раз обновите страницу http://wowa55.pz9.ru/36.php - там небольшой бонус. | |
| |
|
|
| |
|
|
| |
для: Deed
(26.05.2013 в 11:18)
| | | Довольно таки сложно настроить код под реальную ширину окна. Если сделать
#view_log{
position: relative;
width: 600px;
height: 300px;
border: 5px solid blue;
overflow-x: hidden;
overflow-y: scroll;
padding-left: 6px;
background-color: #ECF2E6;
font-family: sans-serif;
}
|
то все разваливается: http://wowa55.pz9.ru/38.php И манипуляциями других параметров собрать не удается - то влево скашивается, то вниз уходит...
(Бесплатный хостинг - он только для настройки. Поэтому блокировку его баннера можно и убрать - чтобы код излишне не усложнять). | |
| |
|
|
| |
|
|
| |
для: Владимир55
(26.05.2013 в 12:01)
| | | Да ничего не разваливается. #view_log обрамлен <div id="log_wrp">, поэтому ширину-высоту нужно корректировать и для него. Обрамление сделано исключительно для того, чтобы в IE 8 была видна прокрутка #view_log.
Кстати, в 36.php #view_log можно закрывать и по нажатию на Еsc | |
| |
|
|
| |
|
|
| |
для: Deed
(26.05.2013 в 12:26)
| | | Это я понимаю и, конечно же, #log_wrp тоже пытался корректировать. Но приемлемых результатов достичь не удается. Вот смотрите: http://wowa55.pz9.ru/38.php | |
| |
|
|
