Javascript-форум (https://javascript.ru/forum/)
-   Internet Explorer (https://javascript.ru/forum/css-html-internet-explorer/)
-   -   Я - нуб. Нужна помощь :) (https://javascript.ru/forum/css-html-internet-explorer/3479-ya-nub-nuzhna-pomoshh.html)

AMARIAL 24.04.2009 18:56
Я - нуб. Нужна помощь :)
 
:help: помогите пожалуйста. вопрос для специалистов)))

вот фреим в котором будет обновлятся главная информация(центральная часть сайта):

<iframe name="I1" src="body.html" width="800" height="900" marginwidth="1" marginheight="1" scrolling="no" border="0" frameborder="0">Ваш обозреватель не поддерживает встроенные рамки или он не настроен на их отображение.
</iframe>

в зависимости от нажатой ссылки(например:
<a target="I1" href="body2.htm">Новости</a>), высота фрейма должна поменятся на высоту таблицы той страницы, на которую была ссылка(в данном случае страница body2.htm с одной таблицей и 1-ой ячейкой).

если это затруднительно, то мне нужно, чтоб при нажатии ссылки, поменялась высота фрейма на определённое число(например на height="1033")

заранее: спасибо большое за помошь))))

x-yuri 25.04.2009 01:50
Цитата:
Я - нуб. Нужна помощь :)
http://javascript.ru/unsorted/read
а по-содержаельнее темы слабо называть ;)

по теме: а зачем тут iframe? Это такой способ исключить дублирование шапки/меню за незнанием php (и подобных)?

AMARIAL 25.04.2009 11:39
спасибо))) за совет, возьмусь за РНР))) и за javaScript

galileopro 25.04.2009 11:57
Помогите! Не работает элементарный код
<script language="JavaScript">
document.getElementById(”nomer”).src="scrin3.j pg";
</script>
<body>
<div id=”nomer”><img src="scrin2.jpg"></div>
</body>
Должно поменять URL изображения на URL "scrin3.jpg"а выводит все тот же "scrin2.jpg"

Gvozd 25.04.2009 12:02 
<body>
<div id=”nomer”><img src="scrin2.jpg"></div>
<script language="JavaScript">
document.getElementById(”nomer”).src="scrin3.j pg";
</script>
</body>

вот так сработает.
в вашем случае,на момент, когда выполнялся JS рисунка на самом деле еще не было.
в таком порядке, как я показал, он уже есть

galileopro 25.04.2009 14:16
Gvozd
Спасибо. Я и сам потом допер, ведь Javascript выходит применялся к несуществующему id.

galileopro 25.04.2009 14:27
Есть код, который выводит довольно интересное слайд-шоу(может кто и воспользуется), но прикол в том, что сначала картинка выводится в нормальном довольно медленном темпе, а потом сильно ускоряется, и у меня виснет довольно нехилая двухядерная машина, хотя поставил
SetTimeout("...",20) - довольно много. Помогите исправить глюк, плиз.
<script>
var slide = new Array;
var pictureName = new Array("scrin1.jpg", "scrin2.jpg", "scrin3.jpg", "scrin4.jpg","scrin5.jpg", "img3.jpg");
for (var i = 0; i < pictureName.length; i++) {
     slide[i] = new Image();
     slide[i].src = pictureName[i];
}
var m=0; var n=10; var l=10; var k=0; var Number=0;
function next2(){
if(k<70){
w=w+10;
h=h+8;
l=l+2;
n=n+1;
document.getElementById("before").width=w;
 document.getElementById("before").height=h;
document.getElementById("before_div").style.left=l;
document.getElementById("before_div").style.filter="alpha(opacity="+n+")";
k++;
setTimeout('next2()',20);
}
if((k>=70)&&(k<140)){
w=w-10;
h=h-8;
l=l+10;
n=n-1;
document.getElementById("before").width=w;
 document.getElementById("before").height=h;
document.getElementById("before_div").style.left=l;
document.getElementById("before_div").style.filter="alpha(opacity="+n+")";
k++;
setTimeout('next2()',20);
}
if((k>=140)&&(k<308)){
l=l-5;
n=n+1;
document.getElementById("before").width=w;
document.getElementById("before").height=h;
document.getElementById("before_div").style.left=l;
document.getElementById("before_div").style.filter="alpha(opacity="+n+")";
k++;
setTimeout('next2()',20);
}
if(k==308){
k=1;
if(Number==5){
document.getElementById("before").src = slide[Number].src;
Number=0;
setTimeout('next2()',20);
}
else{
Number++
document.getElementById("before").src = slide[Number].src;
setTimeoutl('next2()',20);
}
}
}
</script>
<style>
.pic { position: absolute; top: 10px; left: 10px }
</style>
<body onload="setTimeout('next2()',1000)">
<div id="before_div" class="pic"><img id="before" src="scrin1.jpg" width=50 height=30></div>
<script>w=50;h=30;</script>
</body>

x-yuri 25.04.2009 15:56 
document.getElementById(”nomer”).src="scrin3.j pg";

забавное расширение
Цитата:
Помогите исправить глюк
дай ссылку на страничку
Цитата:
спасибо))) за совет, возьмусь за РНР))) и за javaScript
для начала, кстати, можно ssi

galileopro 25.04.2009 17:11
x-yuri
Спасибо, я уже исправил, там были небольшие проблемы с применением setTimeout()
Нужно "зацикливать" setTimeout()-том не саму функцию next2(), а её применение.
Т. е. скажем описати в head саму функцию(без последней части, чтобы она не циклилась), а с setTimeout()-том играться, скажем в body, и аккуратно посчитать однократное время выполния функции.

galileopro 25.04.2009 17:34
http://letitbit.net/download/b5c5e6c...ernew.rar.html ссылка на работающий вариант. Может кто-то доработает и будет прикольное слайд-шоу

galileopro 25.04.2009 20:13
Мопогите разобраться. Вот код и ссылка на исходник слайдшоу, где картинки меняют друг друга постепенно затухая(предыдущая затухает, последующая появляется). Но постепенно затухание необоснованно ускоряется и все портится((Картинки меняются слишком быстро и затухание вообще не заметно. Я уже ставил setTimeout на 1000 мс перед каждой перерисовкой, но все равно это лишь вопрос времени. Постепенно оно ускоряется до неимоверности...
Вот код:
<script>
var slide = new Array;
var pictureName = new Array("scrin1.jpg", "scrin2.jpg", "scrin3.jpg", "scrin4.jpg","scrin5.jpg", "img3.jpg");
for (var i = 0; i < pictureName.length; i++) {
slide[i] = new Image();
slide[i].src = pictureName[i];
}
var l=100;
var k=0;
var i=0;

function next(){
l=l-1;
document.getElementById("before").width=400;
document.getElementById("before").height=300;
document.getElementById("before_div").style.filter ="alpha(opacity="+l+")";
k++;
document.getElementById("after").width=400;
document.getElementById("after").height=300;
document.getElementById("after_div").style.filter ="alpha(opacity="+k+")";
setTimeout("next()",50);

if(k==100)return;
}

function Slaid(){
if(i<=4){
l=100; k=0;
document.getElementById("before").src=pictureName[i];
i++
document.getElementById("after").src=pictureName[i];
next();
}
if(i==5){
l=100; k=0;
document.getElementById("before").src=pictureName[i];
i=0;
document.getElementById("after").src=pictureName[i];
next();
}
setTimeout('Slaid()',5000);
}
</script>
<style>
.pic { position: absolute; top: 40px; left: 10px }
</style>
<body onload="setTimeout('Slaid()',1000)">
<body bgcolor="deepskyblue" text="blue" link="yellow" vlink="gold">
<p align=center>Баннер "Затухание"</p>
<div id="before_div" class="pic"><img id="before" src="scrin1.jpg" width=400 height=300></div>
<div id="after_div" class="pic"><img id="after" src="scrin2.jpg" width=400 height=300></div>
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br><br>
<p><a href="Baners.html">Назад</a></p>
</body>
Вот ссылка на работающее приложение:
http://letitbit.net/download/81eb65b...hanie.rar.html

http://letitbit.net/download/81eb65b...hanie.rar.html

x-yuri 26.04.2009 03:09
давай для начала воспользуемся тэгами для орформления кода (html в твоем случае, есть иконка на панели инструментов) + добавь отступы, а то ничего не понятно ;)

galileopro 26.04.2009 09:54
<doctype html Public "_//w3c// DTD html 4.0 Frameset//En"
"_The_latest_version_/frameset.dta">
<html>
<head>
<title>Затухание слайдов</title>
<script>
var slide = new Array;
var pictureName = new Array("scrin1.jpg", "scrin2.jpg", "scrin3.jpg", "scrin4.jpg","scrin5.jpg", "img3.jpg");
for (var i = 0; i < pictureName.length; i++) {
slide[i] = new Image();
slide[i].src = pictureName[i];
}
var l=100;
var k=0;
var i=0;

function next(){
l=l-1;
document.getElementById("before").width=400;
document.getElementById("before").height=300;
document.getElementById("before_div").style.filter ="alpha(opacity="+l+")";
k++;
document.getElementById("after").width=400;
document.getElementById("after").height=300;
document.getElementById("after_div").style.filter ="alpha(opacity="+k+")";
setTimeout("next()",50);
if(k==100)return;
}

function Slaid(){
if(i<=4){
l=100; k=0;
document.getElementById("before").src=pictureName[i];
i++
document.getElementById("after").src=pictureName[i];
next();
}
if(i==5){
l=100; k=0;
document.getElementById("before").src=pictureName[i];
i=0;
document.getElementById("after").src=pictureName[i];
next();
}
setTimeout('Slaid()',5000);
}
</script>

<style>
.pic { position: absolute; top: 40px; left: 10px }
</style>

<body onload="setTimeout('Slaid()',1000)">

<div id="before_div" class="pic"><img id="before" src="scrin1.jpg" width=400 height=300></div>
<div id="after_div" class="pic"><img id="after" src="scrin2.jpg" width=400 height=300></div>
</body>
</html>

Riim 26.04.2009 10:00
Интересно, найдется, кто ни будь, у кого хватит терпения объяснить, как пользоваться тегами.

galileopro 26.04.2009 10:08
имешь в виду использовать теги
? А отступы я ставил везде, но они почему-ть не отобразились:-?

Riim 26.04.2009 10:30
О, я вижу смайл. Прогресс.

Gvozd 26.04.2009 10:32
:WALL:
galileopro,
иелись в виду BB-теги при написании сообщений.
когда ты пишеш сообщение, то у тебя рядом есть несколько кнопочек.
если ты выделиш HTML-код в своем сообшении, и нажмеш кнопку с угловыми скобками, то получиш:
<html>
    </html>

а если со свертком, то получиш
alert('Java Script');

galileopro 26.04.2009 10:54
Вот упрощенный вариант кода с той же проблемой. Здесь картинка "scrin1.jpg" меняется на "scrin2.jpg" причем первая постепенно затухает, а вторая постепенно появляется, но постепенно выполнение скрипта самопроизвольно ускоряется и затухание становится практически незаметым. Если кто-нибудь знает как исправить - напишите.
<doctype html Public "_//w3c// DTD html 4.0 Frameset//En"
"_The_latest_version_/frameset.dta">
<html>
<head>
<title>Затухание слайдов</title>
<script>
var l=100;
var k=0; 
function next(){
l=l-1;
document.getElementById("before").width=400;
document.getElementById("before").height=300;
document.getElementById("before_div").style.filter ="alpha(opacity="+l+")";
k++;
document.getElementById("after").width=400;
document.getElementById("after").height=300;
document.getElementById("after_div").style.filter ="alpha(opacity="+k+")";
setTimeout("next()",50);
if(k==100)return;
}

function Slaid(){
l=100; 
k=0; 
document.getElementById("before").src="scrin1.jpg";
document.getElementById("after").src="scrin2.jpg";
setTimeout('next()',500);
setTimeout('Slaid()',5000);
}
</script>

<style>
.pic { position: absolute; top: 40px; left: 10px }
</style>

<body onload="setTimeout('Slaid()',1000)"> 
<div id="after_div" class="pic"><img id="after" src="scrin1.jpg" width=400 height=300></div>
<div id="before_div" class="pic"><img id="before" src="scrin2.jpg" width=400 height=300></div>
</body>
</html>

galileopro 26.04.2009 10:58
Спасибо Gvozd. Ну вроде-бы выделился скрипт...:no:

x-yuri 26.04.2009 18:15
1) лучше не использовать глобальных переменных:
function next(){
...
document.getElementById("before_div").style.filter ="alpha(opacity="+arguments.callee.i+")";
...
function Slaid(){
...
next.i = 0;
setTimeout('next()',500);
...

2) фильтры есть только в ie
3) 
if(k==100)return;

то же самое, что
if(k==100);

то же самое что
// ;)

4)
Цитата:
Вот ссылка на работающее приложение
я имел в виду не ссылку на файлообменник, а на страницу, которая не работает, чтобы прямо в inet'е можно было посмотреть... но уже не нужно

galileopro 27.04.2009 15:42
Спасибо, x-yuri, за замечания. К счастью этот код работает.:) А вот с затуханием слайдов атк ничего и не получилось:( .

x-yuri 27.04.2009 17:18
Цитата:
К счастью этот код работает
ты про 1) и 2) ?
а вот 3) объясняет, почему у тебя затухания не работают. Потому что ты можешь убрать ту строчку и ничего не изменится - у тебя каждый запущенный процесс затухания никогда не заканчивается

galileopro 27.04.2009 20:09
Он заканчивается, когда k==100 (когда одно из изображений имеет максимальную яркость). Говорил я про 1 код)). Ну 2 и 3 имеют одну и ту же проблему и если понять как исправить 3(он короче), то 2 - раз плюнуть))

galileopro 27.04.2009 20:19
2 лучше не смотреть, чтобы время не тратить. Я специально выложил 3 для упрощения формулировки проблемы. Замечу еще, что проверяю я только условие k==100, так как в этот момент l==0(типа первое изображение стало максимально ярким, а второе - затухло).

x-yuri 28.04.2009 00:26
Цитата:
Он заканчивается, когда k==100 (когда одно из изображений имеет максимальную яркость)
он не заканчивается, я же говорю если ты уберешь "if(k==100)return;", то ничего в твоем коде не измениться. Т.е. у тебя каждые 5 сек запускаются процессы затухания, и ни один из них никогда не заканчивается
добавь в начало функции next:
var div = document.getElementById('div_'+date);
	if(! div) {
		div = document.createElement('div');
		div.id = 'div_'+date;
		document.body.appendChild( div );
	}
	div.innerHTML = Number(div.innerHTML)+1;

и запускай next следующим образом:
setTimeout('next("'+(new Date())+'")',500);

Цитата:
Ну 2 и 3 имеют одну и ту же проблему и если понять как исправить 3(он короче), то 2 - раз плюнуть))
нет, это разные проблемы
p.s. под 1, 2, 3 я подразумеваю номера замечаний, а ты, кажется, свои варианты кода. Замечания 1-3 касаются последнего твоего варианта кода

galileopro 28.04.2009 19:50
Спасибо, x-yuri. Но твой код у меня не заработал, и некоторые команды я не понял(я еще на пути к позаннию тайн мастерства). Например, что такое document.body.appendChild( div ); и next.i = 0; из второго замечания. Если можешь, то скажи елементы какого скрипта(DOM, innerHTML или что-то другое) ты использовал, я почитаю, чтобы разобраться. Ну а код я чудесным образом оживил, если сможешь, то скажи какие недостатки в этом варианте.:) 
<script>
var l=100;
var k=0; 
function next(){
if(k<100){l=l-1;
document.getElementById("before").width=400;
document.getElementById("before").height=300;
document.getElementById("before_div").style.filter ="alpha(opacity="+l+")";
k++;
document.getElementById("after").width=400;
document.getElementById("after").height=300;
document.getElementById("after_div").style.filter ="alpha(opacity="+k+")";
setTimeout("next()",5);}
}
 
function Slaid(){

l=100; 
k=0; 
document.getElementById("before").src="scrin3.jpg";
document.getElementById("after").src="scrin4.jpg";
setTimeout('next()',500);
setTimeout('Slaid()',4000);
}
</script>
 
<style>
.pic { position: absolute; top: 40px; left: 10px }
</style>
 
<body onload="setTimeout('Slaid()',1000)"> 
<div id="after_div" class="pic"><img id="after" src="scrin3.jpg" width=400 height=300></div>
<div id="before_div" class="pic"><img id="before" src="scrin4.jpg" width=400 height=300></div>
</body>

И в Опере это не работает, так как фильтров там нет. Ну я переделаю так как ты советовал в замечании 2) а пока открывать надо в ie.

x-yuri 28.04.2009 20:40
вот что должно было получиться (там надо было еще пару изменений внести, тут видно, что ни одно затухание фактически не заканчивается):
<html>
<head>
<title>Затухание слайдов</title>
<script>
var l=100;
var k=0; 
function next( date ){
	var div = document.getElementById('div_'+date);
    if(! div) {
        div = document.createElement('div');
        div.id = 'div_'+date;
        document.body.appendChild( div );
    }
    div.innerHTML = Number(div.innerHTML)+1;
l=l-1;
document.getElementById("before").width=400;
document.getElementById("before").height=300;
document.getElementById("before_div").style.filter ="alpha(opacity="+l+")";
k++;
document.getElementById("after").width=400;
document.getElementById("after").height=300;
document.getElementById("after_div").style.filter ="alpha(opacity="+k+")";
setTimeout("next('"+date+"')",50);
if(k==100)return;
}
 
function Slaid(){
l=100; 
k=0; 
document.getElementById("before").src="scrin1.jpg";
document.getElementById("after").src="scrin2.jpg";
setTimeout('next("'+(new Date())+'")',500);
setTimeout('Slaid()',5000);
}
</script>
 
<style>
.pic { position: absolute; top: 40px; left: 10px }
</style>
 
<body onload="setTimeout('Slaid()',1000)"> 
<div id="after_div" class="pic"><img id="after" src="scrin1.jpg" width=400 height=300></div>
<div id="before_div" class="pic"><img id="before" src="scrin2.jpg" width=400 height=300></div>
</body>
</html>

твою задачу я бы решил так (запускать не пробовал):
function next( continue ) {

	if(! continue)
		arguments.callee.opacity = 0;
	if(arguments.callee.opacity == 100)
		return;
	opacity( document.getElementById("before_div"), 100-arguments.callee.opacity );
	opacity( document.getElementById("after_div"), arguments.callee.opacity );
            arguments.callee.opacity++;
	setTimeout("next(true);",5);
}


function opacity( el, v ) {

	el.style.opacity = v;
	el.style.MozOpacity = v;
	el.style.KhtmlOpacity = v;
	el.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=' + (v*100) + ')';
}

 
function Slaid(){
 
	document.getElementById("before").src="scrin3.jpg";
	document.getElementById("after").src="scrin4.jpg";
	setTimeout('next();',500);
	setTimeout('Slaid();',4000);
}

можешь еще почитать http://www.tigir.com/opacity.htm (там более универсальный способ задания прозрачности, учитывается, что могут быть назначены другие фильтры)
document.body.appendChild( div );

добавляем в конец документа элемент, который хранится в переменной div
next.i = 0;

функции в js являются объектами, поэтому информацию, необходимую лишь функции, лучше хранить в ней самой. К этой, своей, переменной можно обращаться также, но иногда удобнее не упоминать имя (а вдруг оно измениться) или имени просто нету (анонимная функция). Тогда внутри самой функции пишут arguments.callee.i (arguments.callee - ссылка на функцию, в которой сейчас находимся)
p.s. недостатки твоего варианта: 1) использование глобальных переменных; 2) еще лучше избегать лишних уровней вложенности... вместо
if(k<100){
    l=l-1;
    ...
}

лучше писать
if(k>=100)
    return;
l=l-1;
...

galileopro 28.04.2009 21:23
Фух, просветил:dance: Теперь все более-менее прозрачно.


Часовой пояс GMT +3, время: 07:39.