JavaScript

  • Автор теми Cris
  • Дата створення
A

AkeL.php

Guest
Как реализуется outerHTML в Mozilla и IE?
 
A

AkeL.php

Guest
Не совсем такой ответ хотелось бы услышать.
Может кто уже нашел самый подходящий вариант, чтобы мне не тестить кучу разных.
 

akick

letter to god
Re: Ответ: JavaScript

Вообщем, никогда не работал с яваскриптом, но пришлось.
Времени весь вкуривать нету.
Надо сделать 2 взаимосвязанные формы(государства и области)
Формы типа select.
Когда выбираешь какое либо государство, появляется список в соседней форме его областей или регионов. Надо срочно.
тут скорее ajax в помощь.. вешаем на корневой селект обработчик onchange и передаем серверной стороне какой там елемент кликнут this.options[this.selectedIndex].value
Код:
<select onchange="getNew(this.options[this.selectedIndex].value)">
</select>
далее уж как душе угодно посылаем ли мы ajax запрос либо просто забиваем елементы из набора в новый блок...
Код:
var object = document.getElementById('some_id');
для очистки селекта можно выполнить
Код:
object.options.length  = -1;
както так.. ну и далее просто заполняем хеш
Код:
for(i=0;i<=10;i++)
{
 object.options[i].value = 'vv';
 object.options[i].text = 'bubu';
}
что может быть проще ?)))
 

PainKiller

Пастафарианец
Команда форуму
Супер Модератор
Re: Ответ: JavaScript

тут скорее ajax в помощь.. вешаем на корневой селект обработчик onchange и передаем серверной стороне какой там елемент кликнут this.options[this.selectedIndex].value
Код:
<select onchange="getNew(this.options[this.selectedIndex].value)">
</select>
далее уж как душе угодно посылаем ли мы ajax запрос либо просто забиваем елементы из набора в новый блок...
Код:
var object = document.getElementById('some_id');
для очистки селекта можно выполнить
Код:
object.options.length  = -1;
както так.. ну и далее просто заполняем хеш
Код:
for(i=0;i<=10;i++)
{
 object.options[i].value = 'vv';
 object.options[i].text = 'bubu';
}
что может быть проще ?)))
Пролема давно себя исчерпала, но все равно спасибо=)
 

Cris

Member
немогу придумать как написать такой скриптик:
на страничку грузиться картинка в <img src="..." height=700 width=1000> мне надо скриптом делать маштабирование:
картинка грузится 7000х4000 - тег ее сворачивает в 1000х700 при нажатии на картинку он должна становиться 7000х4000 но показиваться только в окошке 1000х700 и та часть в которую я нажал мышкой
 

dreamer

Member
немогу придумать как написать такой скриптик:
на страничку грузиться картинка в <img src="..." height=700 width=1000> мне надо скриптом делать маштабирование:
картинка грузится 7000х4000 - тег ее сворачивает в 1000х700 при нажатии на картинку он должна становиться 7000х4000 но показиваться только в окошке 1000х700 и та часть в которую я нажал мышкой
HTML:
<div id=container><img id=image src=... class="full" onclick="toggleZoom(event)"/></div>
<style>
#container { overflow: hidden; position: relative; }
#image { position: absolute; }
#image.full { width: 1000px; height: 700px; }
#image.zoom { width: 7000px; height: 4000px; }
</style>
<script>
var zoomed_w = 1000;
var zoomed_h = 700;
var full_w = 7000;
var full_h = 4000;
function toggleZoom(e) {
    var img= e.target ? e.target : e.srcElement;
    if (img.className == "full") {
        img.className = "zoom";
        img.style.left = -(full_w - e.clientX + zoomed_w/2);
        img.style.top = -(full_h - e.clientY + zoomed_h/2);
    }
    else {
        img.className = "full";
        img.style.left = 0;
        img.style.top = 0;
    }
}
</script>
Что-то типа такого. Не тестил так что уж сам :)
 

Cris

Member
HTML:
<div id=container><img id=image src=... class="full" onclick="toggleZoom(event)"/></div>
<style>
#container { overflow: hidden; position: relative; }
#image { position: absolute; }
#image.full { width: 1000px; height: 700px; }
#image.zoom { width: 7000px; height: 4000px; }
</style>
<script>
var zoomed_w = 1000;
var zoomed_h = 700;
var full_w = 7000;
var full_h = 4000;
function toggleZoom(e) {
    var img= e.target ? e.target : e.srcElement;
    if (img.className == "full") {
        img.className = "zoom";
        img.style.left = -(full_w - e.clientX + zoomed_w/2);
        img.style.top = -(full_h - e.clientY + zoomed_h/2);
    }
    else {
        img.className = "full";
        img.style.left = 0;
        img.style.top = 0;
    }
}
</script>
Что-то типа такого. Не тестил так что уж сам :)
спс, ша тестить буду
 

Cris

Member
вот рабочий вариант:
Код:
<html>
<head>
<title>
Demographics.su...
</title>
<style>
#map {overflow:hidden; width: 1280px; height: 768px;}
</style>
<script type=text/javascript>
function zoom(a,event)
{
if(a.width==7773)
{
a.style.cssText="position:relative; width: 1280px; height: 768px; top: 0px; left: 0px;";
}
else
{
mx=event.clientX;
my=event.clientY;
x=-((mx-a.offsetLeft)*6-640);
if(x>0) x=0;
y=-((my-a.offsetTop)*5-384);
if(y>0) y=0;
a.style.cssText="position:relative; width: 7773px; height: 3956px; top: "+y+"px; left: "+x+"px;";
}
}
</script>
</head>
<body>
<div id="map"><img id="image" src="..." width=1280 height=768 onclick="zoom(this,event);"/></div>
</body>
</html>
много изменилось)
 
Зверху