0
그래서 일부 JavaScript를 완료하고 이미지를 업데이트하는 링크를 코딩하는 데 어려움을 겪고 있습니다. 내 스크립트를 사용하는 부모 창에서 원격 하위 창을 열어 이미지를 조작합니다. 하위 창에서 첫 번째 이미지와 마지막 이미지를 엽니 다. 두 개의 링크가 "다음"이미지와 이전 이미지를 제어합니다.자식 창에서 배열 요소를 사용하여 부모 창에서 이미지를 getElementById로 변경하십시오.
Heres는 지금까지
HTML의 부모 창 무슨 :
<html>
<head>
<title> </title>
<script type="text/javascript" src="scriptss.js">
</script>
</head>
<body>
<img src="images/img0.jpg" width="200px" height="200px" id="myImage" name="myImage" /></img>
<h1>XXX</h1>
<a href="#" id = "opens" >open</a>
</br>
<a href="#" id="closes">close</a>
</br>
</body>
<html>
자식 창 HTML을 (:(BTW 여기에 HTML을 게시하는 방법을 생각하지 않은) :
<html>
<head>
<title> Matt Beckley Assignment Remote</title>
<link rel="stylesheet" type="text/css" href="remote.css" />
<script type="text/javascript" src="scriptss.js">
</script>
</head>
<body>
<h1>My Remote</h1>
<a href="#" id="first" onclick="first()">First Image</a>
</br>
<a href="#" id="next">Next Image</a>
</br>
<a href="#" id="previous">Previous Image</a>
</br>
<a href="#" id="last">Last Image</a>
</br>
<a href="#" id="closess">close</a>
</body>
</html>
JAVASCRIPT 자식 노드
var newWindow = null;
window.onload = init;
var myImages = new Array();
//start loop - length depends on how many images you need to preload
for (var i=0; i<5; i++) {
//create new image object
var tempImage = new Image();
//assign name|path of image to src property of image object
tempImage.src = "img" + (i+1) + ".jpg";
}
function init()
{
for(var i=0; i<document.links.length; i++)
{
document.links[i].onclick = changeWindowState;
}
}
function windowOpen(){
if(newWindow && !newWindow.closed){
return true;
}
return false;
}
function changeWindowState()
{
if (this.id =="closes")
{
if(windowOpen())
{
newWindow.close();
}
else
{
alert("The window isn't open");
}
}
if (this.id =="closess")
{
if(windowOpen())
{
remotetest.html.close();
}
else
{
alert("The window isn't open");
}
}
if(this.id == "opens")
{
if(windowOpen())
{
alert("The Window is alreadyopen!");
}
else
{
newWindow = window.open ("remotetest.html","remoteWin","resizeable=no,width=200,height=200");
}
}
return false;
}
function first()
{
if(this.id == "first")
{
alert("box");
}
else(this.id == "first")
{
alert("box");
}
}
어쨌든 나는 내 이미지를 미리로드하고 있으며 올바르게 파악했습니다. 이미지 태그의 부모 노드에서 내 요소에 액세스하려고하고 배열 요소 1-6을 표시하려고합니다. 즉, 이미지 1부터 이미지 6 아이디어는 자식 노드의 버튼을 눌러서 인스턴스의 첫 번째 이미지 요소 [0]을 표시하고 다른 버튼 요소 [5] 을 누르거나 다음 요소 [i + 1]에 대해 다른 버튼을 누릅니다. ] 다른 버튼으로. 도와 주셔서 감사합니다.