Удаление лишних объектов
Народ поможите пожалуйста. На профи ни капли не придендую, делаю одну штучку себе именно для IE (не пинайте за него), она работает, НО, как всегда есть своё НО.
В шапке пишу такой код (кратко суть - при наведении на картинку рисует её увеличенное изображение)
ToolTip.offsetX = - (10 + IMG_size + 10)
ToolTip.offsetY = 17
function ToolTip(obj, text)
{
if (!obj || obj.nodeType != 1) { throw "Illigal argument exception" }
var tip = document.createElement("DIV")
tip.className = 'tool_tip'
tip.innerHTML = "<CENTER>Моё окно</CENTER>"
tip.style.top = 10
tip.style.left = 10
document.body.appendChild(tip)
obj.onmouseout = function (ev)
{ tip.style.visibility = 'hidden' }
obj.onmousemove = function(ev)
{
tip.style.visibility = 'visible'
if (window.event) ev = window.event
if(ev.clientX+20+tip.offsetWidth+18 > document.body.clientWidth) { ToolTip.offsetX =- tip.offsetWidth - 20 } else { ToolTip.offsetX = 20 }
if(ev.clientY+10+tip.offsetHeight+0 > document.body.clientHeight) { ToolTip.offsetY =- tip.offsetHeight - 10 } else { ToolTip.offsetY = 10 }
tip.style.left = ev.clientX + document.body.scrollLeft + ToolTip.offsetX
tip.style.top = ev.clientY + document.body.scrollTop + ToolTip.offsetY
}
}
function initToolTips()
{
// предположительно тут надо как-то удалять старые объекты, прежде чем создавать новые
var tags, tooltext
for(var i = 0; i < arguments.length; i++)
{
tags = document.body.getElementsByTagName(arguments[i])
for (var j = 0; j < tags.length; j++)
if ((tooltext=tags[j].getAttribute('tooltip'))) { ToolTip(tags[j], tooltext) }
}
}
В теле страницы скриптом вписываю картинку(и)
sss.innerHTML("<IMG tooltip='" + screens + "' src='" + screens + ".jpg'>")
....
initToolTips("img") // для инициализации всплывающих окошек
Ну и вот это самое тело формируется динамически по клику повторно переписывается через innerHTML с последующей инициализацией. Зачем так реализовано это не обсуждается, т.к. этот пример очень сильно обрезан для демонстрации только основного кода. А теперь суть самой проблемы!!! При первой инициализации в теле страницы (если смотреть отладчиком) появляется DIV, ну как бы всё хорошо,так и должно быть. При повторной инициализации в теле страницы уже два DIV`а, ну и так далее по нарастающей. Т.к. истестна я гружу не только одну картинку, а большой объём контента, то страница разрастается очень сильно (видно только в отладчике, внешне всё замечательно) и сжирает кучу ресурсов. Потому предполагаю, что при инициализации надо как-то убирать ранее добавленные объекты! Не силён вообще я пока что в этом, я только учусь, поможите |
DjFuntik,
if ((tooltext=tags[j].getAttribute('tooltip')) && tags[j].className != "ready") {tags[j].className = "ready"; ToolTip(tags[j], tooltext) }
|
Спасибо, я конечно подправил, но результат не тот что требуется.
Предложенный вариант, как я понимаю, вносит изменения в код формирования объектов, т.е. ЕСЛИ ОНИ ЕСТЬ, ТО НЕ СОЗДАВАТЬ НОВЫЕ ПОДОБНЫЕ. Мне же нужно что-то типа .removeChild, чтобы ранее добавленное через appendChild() удалять, перед тем как новые добавлять на страницу. Чувствую, надо поподробнее описать сам код.
<HTML>
<HEAD>
<SCRIPT language=JavaScript>
ToolTip.offsetX = - (10 + IMG_size + 10)
ToolTip.offsetY = 17
function ToolTip(obj, text)
{ ... см.пост №1 ... }
function initToolTips()
{
var tags, tooltext
for(var i = 0; i < arguments.length; i++)
{
tags = document.body.getElementsByTagName(arguments[i])
for (var j = 0; j < tags.length; j++)
if ((tooltext = tags[j].getAttribute('tooltip')) && tags[j].className != "ready")
{ tags[j].className = "ready"; ToolTip(tags[j], tooltext) }
}
}
function proc(n)
{
//тут естестно не одна картинка, а довольно большая страница формирующаяся динамически
text = "<IMG tooltip='" + screens + "' src='screens"+n + ".jpg'>"
sss.innerHTML = text
initToolTips("img") // для инициализации всплывающих окошек на обновлённом содержимом страницы
}
</SCRIPT>
</HEAD>
<BODY>
<IMG scr="screens1" onCklick=proc(1)>
<IMG scr="screens2" onCklick=proc(2)>
<IMG scr="screens3" onCklick=proc(3)>
<DIV id='sss'></DIV>
<SCRIPT language=JavaScript>proc(1)<SCRIPT> <!-- чтоб сразу п1 выполнился-->
</BODY>
</HTML>
|
В общем, т.к. sss довольно громоздкое, то через десяток кликов в это самое sss перестают подгружаться картинки из-за того что их просто много, собственно из-за этого таким образом и разбил станицу на части чтобы можно было подгружать остальное содержимое (именно подгружать, а не загружать через новые страницы), хотелось в одной странице менять содержимое
|
DjFuntik,
if(document.getElementById('tool_tip') && document.getElementById('tool_tip').parentNode) {document.getElementById('content').removeChild(document.getElementById('tool_tip'))}
|
Спасибо, но дело в том что, подобная конструкция не сильно помогла, вродь и делает то что нужно, но вот эффект не тот. При таком варианте всплывающие окна работают, но и дивы в отладчике плодятся. А если оставить этот код без условия, то дивы перестают плодиться.... но и всплывающих окон нет, собственно, вероятно из-за этого они и не плодятся, потому что удалены все полностью, или просто не проинициализировались и не добавились....... видимо придётся полностью код выкладывать чтоб на нём можно было бы подправить (а он большой, придётся упрощать)
|
Привожу сильно порезанный код (только самое необходимое). Можно его воткнуть в файлик HTML и открыть браузером. Предназначен только для IE8 !! (без вариантов, только так).
При такой реализации если смотреть через отладчик, то после вызова proc(n) в сам документ добавляется несколько узлов DIV, при последующем вызове proc(n+1) добавляется ещё несколько узлов DIV и так каждый раз. В результате страница разрастается, отображается только то что требуется, а в отладчике присутствуют ВСЕ добавленные узлы. Хотелось бы чтоб при очередном вызове proc() не просто создавались новые узлы, а предварительно удалялись старые узлы!
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
<STYLE>
IMG {border-width:0px; margin: 3px; align: center}
.tool_tip { border-right: 1px solid; border-top: 1px solid; visibility: hidden; font: 900 15px tahoma; border-left: 2px solid; border-bottom: 2px solid; letter-spacing: 2px; position: absolute}
</STYLE>
<SCRIPT language=JavaScript>
ToolTip.offsetX = - (10 + 400 + 10)
ToolTip.offsetY = 17
function ToolTip(obj, text)
{
if (!obj || obj.nodeType != 1) { throw "Illigal argument exception" }
var tip = document.createElement("DIV")
tip.className = 'tool_tip'
tip.innerHTML = "<CENTER><FONT size=+3>"+text+"</FONT><BR><IMG height=400 width=400 src='"+text+".jpg'><IMG height=400 width=400 src='"+text+".jpg'></CENTER>"
tip.style.top = 10
tip.style.left = 10
document.body.appendChild(tip)
obj.onmouseout = function (ev)
{ tip.style.visibility = 'hidden' }
obj.onmousemove = function(ev)
{
tip.style.visibility = 'visible'
if (window.event) ev = window.event
if (ev.clientX+20+tip.offsetWidth+18 > document.body.clientWidth) { ToolTip.offsetX =- tip.offsetWidth-20 } else { ToolTip.offsetX = 20 }
if (ev.clientY+10+tip.offsetHeight+0 > document.body.clientHeight) { ToolTip.offsetY =- tip.offsetHeight-10 } else { ToolTip.offsetY = 10 }
tip.style.left = ev.clientX + document.body.scrollLeft + ToolTip.offsetX
tip.style.top = ev.clientY + document.body.scrollTop + ToolTip.offsetY
}
}
function initToolTips()
{
//if(document.getElementById('tool_tip') && document.getElementById('tool_tip').parentNode) { document.getElementById('content').removeChild(document.getElementById('tool_tip')) }
var tags, tooltext
for(var i = 0; i < arguments.length; i++)
{
tags = document.body.getElementsByTagName(arguments[i])
for (var j = 0; j < tags.length; j++)
if ((tooltext = tags[j].getAttribute('tooltip')) && tags[j].className != "ready") { tags[j].className = "ready"; ToolTip(tags[j], tooltext) }
}
}
var colon = new Array()
function proc(js)
{
switch (js)
{
case "62": colon = ["66","А","Б","В","Г","Д"]; break
case "96": colon = ["98","Д","Б","В","Г","А"]; break
case "01": colon = ["04","А","Г","В","Б","Д"]; break
}
os = ""
for (var i = 1; i < colon.length; i++) { os += "<IMG tooltip='" + colon[i] + "' src='" + colon[i] + ".jpg'>" }
ts.innerHTML = "<DIV id='content'>" + os + "</DIV>"
initToolTips("img")
}
</SCRIPT>
</HEAD>
<BODY>
<IMG src='screens1.jpg' onClick=proc('62')> <IMG src='screens2.jpg' onClick=proc('96')> <IMG src='screens3.jpg' onClick=proc('01')>
<DIV id='ts'>Область загрузки<DIV><SCRIPT language=JavaScript>proc('62')</SCRIPT>
</BODY>
</HTML>
|
DjFuntik,
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style>
IMG{
border-width:0px;
margin:3px;
align:center;
}
.tool_tip{
border-right:1px solid;
border-top:1px solid;
visibility:hidden;
font:900 15px tahoma;
border-left:2px solid;
border-bottom:2px solid;
letter-spacing:2px;
position:absolute;
}
</style>
<script>
ToolTip.offsetX = -(10 + 400 + 10);
ToolTip.offsetY = 17;
var arrT = [], arrImg = [];
function ToolTip(obj, text) {
if (!obj || obj.nodeType != 1) throw "Illigal argument exception";
var tip = document.createElement("DIV");
arrT.push(tip);
tip.className = "tool_tip";
tip.innerHTML = "<CENTER><FONT size=+3>" + text + "</FONT><BR><IMG height=400 width=400 src='" + text + ".jpg'><IMG height=400 width=400 src='" + text + ".jpg'></CENTER>";
tip.style.top = 10;
tip.style.left = 10;
document.body.appendChild(tip);
obj.onmouseout = function(ev) {
tip.style.visibility = "hidden"
};
obj.onmousemove = function(ev) {
tip.style.visibility = "visible";
if (window.event) ev = window.event;
if (ev.clientX + 20 + tip.offsetWidth + 18 > document.body.clientWidth) ToolTip.offsetX = -tip.offsetWidth - 20;
else ToolTip.offsetX = 20;
if (ev.clientY + 10 + tip.offsetHeight + 0 > document.body.clientHeight) ToolTip.offsetY = -tip.offsetHeight - 10;
else ToolTip.offsetY = 10;
tip.style.left = ev.clientX + document.body.scrollLeft + ToolTip.offsetX;
tip.style.top = ev.clientY + document.body.scrollTop + ToolTip.offsetY
}
}
var colon = new Array;
function proc(js) {
for (var i = 0; i < arrT.length; i++) {
arrT[i].parentNode.removeChild(arrT[i]);
arrImg[i].parentNode.removeChild(arrImg[i])
}
arrT = [], arrImg = [];
switch (js) {
case "62":
colon = ["66","А","Б","В","Г","Д"];
break;
case "96":
colon = ["98","Д","Б","В","Г","А"];
break;
case "01":
colon = ["04","А","Г","В","Б","Д"];
break
}
for (var i = 1; i < colon.length; i++) {
var img = document.createElement("img");
arrImg.push(img);
img.src = colon[i];
ts.appendChild(img);
ToolTip(img, colon[i])
}
};
</script>
<title></title>
</head>
<body>
<img src='screens1.jpg' onclick="proc('62')">
<img src='screens2.jpg' onclick="proc('96')">
<img src='screens3.jpg' onclick="proc('01')">
<div id='ts'></div><script>proc('62')</script>
</body>
</html>
|
Интересно! Эффект кажется достигнут!! Буду проверять, разбираться и пытаться встроить в моё "детище", посмотрим приживётся ли оно.
Спасибо большое за помощь. |
Очень понравилась ваша реализация, но примостить к моему детищу так и не получилось, может направите на путь истинный?
На самом деле в функции proc(js) вместо SWITCH(js) прописана процедура RunJava, а в файле загружаемом этой функцией прописан не массив, а функция с этим самым массивом вместо аргумента, т.е. вот так stroka (["66","А","Б","В","Г","Д"]) (опять же строк таких много и массив сам по себе тоже большой, и аргументы только для упрощения указал как буквы односимвольные)
function proc(js) {
for (var i = 0; i < arrT.length; i++) {
arrT[i].parentNode.removeChild(arrT[i]);
arrImg[i].parentNode.removeChild(arrImg[i])
}
arrT = [], arrImg = [];
os = ""
[B]RunJava(resurs)[/B]
[I]// switch (js) {
// case "62": colon = ["66","А","Б","В","Г","Д"]; break;
// case "96": colon = ["98","Д","Б","В","Г","А"]; break;
// case "01": colon = ["04","А","Г","В","Б","Д"]; break
// }[/I]
for (var i = 1; i < colon.length; i++)
{
var img = document.createElement("img");
arrImg.push(img);
img.src = colon[i]+".jpg";
ts.appendChild(img);
ToolTip(img, colon[i])
}
ts.innerHTML = os
}
function RunJava(resurs)
{
var b = fso.FileExists(resurs)
if (b) { eval(fso.OpenTextFile(resurs, 1, 0).ReadAll()) }
}
function stroka(colon)
{
// тут формируется строка таблицы с картинками из массива colon. (опять же не все элементы массива содержат картинку)
os += "содержимое"
}
файл resurs.js stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]]) stroka ([["67","#"],["+","А2"],["-","Б3"],["+","В7"],["+","Г9"],["-","Д1"]]) stroka ([["68","#"],["+","А3"],["+","Б5"],["-","В1"],["+","Г2"],["+","Д8"]]) вот как раз те которые "-" они без картинок. пытался в процедуру stroka() добавить после каждого добавляемого IMG дописать var img = document.createElement("img"); arrImg.push(img); img.src = mmm+".jpg"; ts.appendChild(img); ToolTip(img, mmm) но чёт это из области фантазёрства мне так кажется... |
DjFuntik,
не могу помочь, не понимаю что вы хотите сделать. |
Хочу примерно тоже самое что и в вашем варианте, но только у меня оно должно подгружаться из файлов js (находятся в том же каталоге что и сама страничка).
За код не пинайте, я тока учусь...
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
<STYLE>
IMG {border-width:0px; margin: 3px; align: center}
.tool_tip { border-right: #9191a2 1px solid; padding-right: 12px; border-top: #9191a2 1px solid; padding-left: 12px; visibility: hidden; padding-bottom: 12px; font: 900 15px tahoma; border-left: #9191a2 2px solid; color: #9191f2; padding-top: 12px; border-bottom: #9191a2 2px solid; letter-spacing: 2px; position: absolute; background-color: #aafaff}
</STYLE>
<SCRIPT language=JavaScript>
ToolTip.offsetX = - (10 + 400 + 10)
ToolTip.offsetY = 17
var arrT = [], arrImg = []
function ToolTip(obj, text)
{
if (!obj || obj.nodeType != 1) { throw "Illigal argument exception" }
var tip = document.createElement("DIV")
arrT.push(tip)
tip.className = "tool_tip"
tip.innerHTML = "<CENTER><FONT size=+3>"+text+"</FONT><BR><IMG height=400 width=400 src='"+text+".jpg'><IMG height=400 width=400 src='"+text+".jpg'></CENTER>"
tip.style.top = 10
tip.style.left = 10
document.body.appendChild(tip)
obj.onmouseout = function(ev)
{ tip.style.visibility = "hidden" }
obj.onmousemove = function(ev)
{
tip.style.visibility = "visible"
if (window.event) { ev = window.event }
if (ev.clientX+20+tip.offsetWidth+18 > document.body.clientWidth) { ToolTip.offsetX =- tip.offsetWidth - 20 } else { ToolTip.offsetX = 20 }
if (ev.clientY+10+tip.offsetHeight+0 > document.body.clientHeight) { ToolTip.offsetY =- tip.offsetHeight - 10 } else { ToolTip.offsetY = 10 }
tip.style.left = ev.clientX + document.body.scrollLeft + ToolTip.offsetX
tip.style.top = ev.clientY + document.body.scrollTop + ToolTip.offsetY
}
}
function RunJava(resurs)
{
var fso = new ActiveXObject("Scripting.FileSystemObject")
var b = fso.FileExists(resurs)
if (b) { eval(fso.OpenTextFile(resurs, 1, 0).ReadAll()) }
}
var colon = new Array()
function stroka(colon)
{
os += "<TABLE><TR>"
for (var i = 1; i < colon.length; i++)
{
os += "<TD><P>....<IMG tooltip='" + colon[i][1] + "' src='" + colon[i][1]+ ((colon[i][0]=="+")?"":"-") + ".jpg'>...</TD>"
var img = document.createElement("img")
arrImg.push(img)
img.src = colon[i][1]+".jpg"
ts.appendChild(img)
ToolTip(img, colon[i][1])
}
os+="</TR></TABLE>"
}
function proc(js)
{
for (var i = 0; i < arrT.length; i++)
{
arrT[i].parentNode.removeChild(arrT[i])
arrImg[i].parentNode.removeChild(arrImg[i])
}
arrT = [], arrImg = []
os = ""
p = location.href
p = p.replace("file:///","")
p = p.replace(/%20/g," ")
p = p.replace(/\//g,"\\")
t = p.split('\\')
RunJava(p.substring(0,p.length - t[t.length - 1].length) + "resurs" + js + ".js")
ts.innerHTML = os
}
</script>
</head>
<body>
<script>
var pp = new Array()
pp = ["62","96","01"]
for (var i = 0; i < pp.length; i++)
document.write("<img src='screens"+(i+1)+".jpg' onclick=proc('"+pp[i]+"')>")
</script>
<div id='ts'></div><script>proc('62')</script>
</body>
</html>
resurs01.js stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]]) stroka ([["67","#"],["+","А2"],["-","Б3"],["+","В7"],["+","Г9"],["-","Д1"]]) stroka ([["68","#"],["+","А3"],["+","Б5"],["-","В1"],["+","Г2"],["+","Д8"]]) resurs62.js stroka ([["68","#"],["+","А3"],["+","Б5"],["-","В1"],["+","Г2"],["+","Д8"]]) stroka ([["67","#"],["+","А2"],["-","Б3"],["+","В7"],["+","Г9"],["-","Д1"]]) stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]]) resurs96.js stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]]) stroka ([["68","#"],["+","А3"],["+","Б5"],["-","В1"],["+","Г2"],["+","Д8"]]) stroka ([["67","#"],["+","А2"],["-","Б3"],["+","В7"],["+","Г9"],["-","Д1"]]) |
DjFuntik,
не осилить мне ваш код. |
Меня интересуют строки 52-56 и 63-68. Строки 63-67 я так полагаю на своём месте, строка 68 не знаю там ли должна остаться? Строки 52-56 это ваш код, просто не знаю как его подвязать к "IMG tooltip"
|
Ну или если так не получается понять мой замысел, то тогда подскажите, пожалуйста, как из страницы удалить все "<DIV class='tool_tip'>" вместе с содержимым?
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
</head>
<body>
<div class="tool_tip">1</div>
<div class="tool_tip">2</div>
<div class="tool_tip">3</div>
<div class="test">4</div>
<div class="test">5</div>
<div class="tool_tip">6</div>
<div class="tool_tip">7</div>
<div class="tool_tip">8</div>
<script>
var div = document.getElementsByTagName('div'), l = div.length, d;
for (; d = div[--l];) { if(d.className == 'tool_tip') d.parentNode.removeChild(d)}
</script>
</body>
</html>
|
Вот теперь просто наиогромнейшее СПАСИБО!
В отладчике на странице только те объекты, которые присутствуют в текущий момент, остальной исторически накопленный мусор удалён!!! P.S. уж в дагонку может и вторую (последнюю в моём детище) проблемку поможете решить? Есть DIV надо его отобразить, загрузить данные, и после окончания загрузки скрыть - ну обычный значёк "LOADING"
<BODY>
<DIV id='waitDiv' style='z-index:1; left: 47%; visibility: visible; position: absolute; top: 50%; text-align: center; background-color=yellow; border-style=groove'><FONT color=red><B><BIG>Идёт загрузка...</BIG></B><BR><IMG src='loading.gif'><BR>Пожалуйста, подождите.</FONT></DIV>
<SCRIPT>
document.all["waitDiv"].style.visibility = 'visible'
// или document.getElementById('waitDiv').style.display='block'
RunJava("resurs.js") // может грузиться и отрабатывать аж до 8-10 секунд
document.all["waitDiv"].style.visibility = 'hidden'
// или document.getElementById('waitDiv').style.display='none'
</SCRIPT>
</BODY>
Проблема в том что значёк не отображается. Если после RunJava поставить alert() или поставить кривой код для заглючивания, то за сообщением будет видно что значёк отображается, если же сбоев и остановок не было, то значёк даже на миллисекунду не отображается. По моей логике не вижу в чём проблема "не отображения". Обыскал кучу интернета, вариантов подходящих для IE без дополнительных библиотек и при том что рабочих не нашёл! Может и тут направите? |
DjFuntik,
может обернуть в
window.onload = function() {
// ваш код
}
чтоб картинка успела загрузится |
На сколько я представляю onload к странице будет относиться, а она уже будет загружена, и в ней будет меняться содержимое "DIV ts", т.е. onload не будет срабатывать... или я не прав?
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
<SCRIPT language=JavaScript>
function RunJava(resurs)
{
var fso = new ActiveXObject("Scripting.FileSystemObject")
var b = fso.FileExists(resurs)
if (b) { eval(fso.OpenTextFile(resurs, 1, 0).ReadAll()) }
}
var colon = new Array()
function stroka(colon)
{
os += "<TABLE><TR>"
for (var i = 1; i < colon.length; i++)
os += "<TD><P>....<IMG src='" + colon[i][1]+ ((colon[i][0]=="+")?"":"-") + ".jpg'>...</TD>"
os+="</TR></TABLE>"
}
function proc(js)
{
document.all["waitDiv"].style.visibility = 'visible' // или document.getElementById('waitDiv').style.display='block'
os = ""
// может грузиться и отрабатывать аж до 8-10 секунд, в загружаемом файле вызов процедуры stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]]) которая наращивает переменную 'os'
RunJava("resurs" + js + ".js")
document.all["waitDiv"].style.visibility = 'hidden' // или document.getElementById('waitDiv').style.display='none'
ts.innerHTML = os
}
</script>
</head>
<body>
<img src='screens1.jpg' onclick=proc('62')>
<img src='screens2.jpg' onclick=proc('96')>
<img src='screens3.jpg' onclick=proc('01')>
<DIV id='waitDiv' style='z-index:1; left: 47%; visibility: visible; position: absolute; top: 50%; text-align: center; background-color=yellow; border-style=groove'><FONT color=red><B><BIG>Идёт загрузка...</BIG></B><BR><IMG src='loading.gif'><BR>Пожалуйста, подождите.</FONT></DIV>
<div id='ts'></div><script>proc('62')</script>
</body>
</html>
Мне нужно чтоб LOADING появлялся не при загрузке страницы, а при вызове proc() и после её отработки он исчезал |
DjFuntik,
не знаю как работает ваша RunJava, может эта функция блокирует браузер на всё время загрузки и показывать что либо бесполезно. |
Вот она
function RunJava(resurs) { var fso = new ActiveXObject("Scripting.FileSystemObject") var b = fso.FileExists(resurs) if (b) { eval(fso.OpenTextFile(resurs, 1, 0).ReadAll()) } } Eval - Функция eval разрешает динамическое выполнение исходного кода JavaScript. Код, переданный в функцию eval, выполняется в том же контексте, в котором вызывается функция eval. OpenTextFile - Открывает указанный файл и возвращает объект TextStream, который можно использовать для чтения из файла или добавления данных в файл. формат: object.OpenTextFile(filename[, iomode[, create[, format]]]) iomode: Необязательный. Указывает режим ввода-вывода. Может иметь значение одной из двух констант: ForReading=1(моё!) или ForAppending=8. create: Необязательный. Значение типа Boolean, которое указывает, можно ли создать новый файл, если файл не существует. True позволяет создать файл, а False - нет(моё!). ReadAll - Выполняет чтение всего файла TextStream и возвращает результирующую строку. Т.е. прочитать файл содержащий java код и выполнить его! В загружаемом и соответственно далее исполняемом файле находится несколько вызовов процедуры stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]]). Сама процедура ничего заумного не делает, просто на основании данных массива формирует HTML код для нарисования таблицы. Очищаем переменную os='', и вызываем RunJava, выполнение его приводит к запуску процедуры STROKA(colon) из файла js, а т.к. EVAL имеет доступ ко всем переменным, то результат выполнения STROKA будет находиться в нашей переменной os, которую мы потом через innerHTML отобразим. Вот собственно и всё. Ничего о блокировках я в описаниях по командам не нашёл. |
Собственно, убрал RunJAVA и воткнул несколько строк STROKA(colon).... блокировать браузер нечем! Файл не загружается, eval не выполняется..... LOADING так и не появился.... значит не RUNJAVe причина
|
DjFuntik,
танцы с бубнами ... перед RunJAVA добавьте document.documentElement.clientWidth; |
нет, если вы намекаете, то что LOADING попадает "куда-то" вне видимой области, то нет - если из
<DIV id='waitDiv' style='z-index:1; left: 47%; visibility: visible; удалить "visibility: visible;", то LOADING отображается в центре экрана, а значит местоположение правильное |
DjFuntik,
картинка не показывается в 3 случаях -- не загружена (браузер не хочет грузить невидимое,может помочь прелоад), не нарисована(пост 23, после изменения ксс дать странице перерисоваться), комп занят загрузкой с сервера(???). всё, более причин не знаю и помочь не могу. |
Ну вот смотрите пост 19 закомментироуйте строки 23 и 27, в строке 37 удалите "visibility: visible;" и запустите. LOADING будет отображаться поверх основного содержимого ибо "z-index:1". Т.е. всё нормально загружено и в нужном месте отображается. На счёт загрузки с сервера (хм), ну так я ж убрал RunJAVA, и соответственно нечего грузить с сервера
|
DjFuntik,
испорченный телефон, если без RunJAVA картинка есть, значит ваша загрузка блокирует показ и весь браузер, пока браузер не загрузит то что нужно, он ничего больше делать не будет, в том числе и показывать картинки. |
Ну к примеру, тут загрузки с сервера и строки 16 и 23 никак ни на что не влияют, если 23 строку закомментировать, то LOADING 16-ой строкой делается видимым,т.е. оно работает, а т.к. в конечном счёте его не видно, то значит и строка 23 работает.... но почему оно выполняется как-то не последовательно ума не приложу......
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
<SCRIPT language=JavaScript>
var colon = new Array()
function stroka(colon)
{
os += "<TABLE><TR>"
for (var i = 1; i < colon.length; i++)
os += "<TD><P>....<IMG src='" + colon[i][1]+ ((colon[i][0]=="+")?"":"-") + ".jpg'>...</TD>"
os+="</TR></TABLE>"
}
function proc(js)
{
document.all["waitDiv"].style.visibility = 'visible' // или document.getElementById('waitDiv').style.display='block'
os = ""
ts.innerHTML = os
if (js==62) stroka ([["66","#"],["+","А1"],["+","Б1"],["-","В8"],["-","Г4"],["+","Д5"]])
if (js==96) stroka ([["67","#"],["+","А2"],["-","Б3"],["+","В7"],["+","Г9"],["-","Д1"]])
if (js==01) stroka ([["68","#"],["+","А3"],["+","Б5"],["-","В1"],["+","Г2"],["+","Д8"]])
setTimeout('ts.innerHTML = os;', 5000);
document.all["waitDiv"].style.visibility = 'hidden' // или document.getElementById('waitDiv').style.display='none'
}
</script>
</head>
<body>
<img src='screens1.jpg' onclick=proc('62')>
<img src='screens2.jpg' onclick=proc('96')>
<img src='screens3.jpg' onclick=proc('01')>
<DIV id='waitDiv' style='z-index:1; left: 47%; visibility: visible; position: absolute; top: 50%; text-align: center; background-color=yellow; border-style=groove'><FONT color=red><B><BIG>Идёт загрузка...</BIG></B><BR><IMG src='loading.gif'><BR>Пожалуйста, подождите.</FONT></DIV>
<div id='ts'></div><script>proc('62')</script>
</body>
</html>
|
DjFuntik,
больше мне добавить нечего. |
О! 23 строку вписал в 22 и эффект почти то что нужно... счас дальше посмотрю подойдёт ли мне в мою детищу
P.S> неа... только при первой загрузке срабатывает, при повторном вызове proc() уже ничего нет PSS> Вообщем решил проблему так: setTimeout('ts.innerHTML = os; initToolTips("img"); document.getElementById("waitDiv").style.display=" none"; document.getElementById("monets").style.display="b lock"', 100); Может не совсем корректно, но зрительно очень похоже на правду |
| Часовой пояс GMT +3, время: 18:19. |