CODEWITHSUNDEEP
javascripthtmlgetelementbyid
Crosswired
Crosswired

Reputation: 3

getting getElementByID to work html5

ok I have been working on this webpage for a week now and have hit a wall. the code is in place except getting the getelementbyid to function. I am trying to make the images in the frame div to change by changing the javascript source when you select an image in the sidebar. What I was wondering is if there is a problem in my code or if the function just doesnt work that way.

<head>
<title>Rivas2</title>
<script id="newset" src="sidescroll.js" type="text/javascript"></script>
<script type= "text/javascript">

function changesrc() {
var sets = document.getElementById('newset');   
switch (value) {
 case '1': sets.src = 'sidescroll.js'; break;
 case '2': sets.src = 'sidescroll2.js'; break;
      }
    }
     </script>
   <style type="text/css">
        body{
background-color:#66FFFF;
}
   .banner{
position:absolute; 
top: 15px; 
left: 300px;}
.sideb1{
position:absolute;
top: 120px;
left: 25px;
height: 530px;
width: 150px;
overflow: auto;}
.frame{
position:absolute; 
top: 120px; 
left: 400px;}   
  .scroll{
position: absolute;
top: 525px;
left: 400px;
}

  </style>
  </head>

  <div class="sideb1" >
    <input type = 'image' src = 'image3.jpg' onclick = 'changesrc(1)' width= "120"           height= "100" alt= " " /><br/> House 1<br/>
    <input type = 'image' src = 'image3.jpg' onclick = 'changesrc(2)' width= "120" height= "100" alt= " " /><br/> House 2<br/>
    <a href="rivas2.html" ><img src="image3.jpg" width= "120" height= "100" alt="" /> </a><br/> House 3<br/>
    <a href="rivas3.html" ><img src="image3.jpg" width= "120" height= "100" alt="" /> </a><br/> House 4<br/>
    <a href="rivas2.html" ><img src="image3.jpg" width= "120" height= "100" alt="" /> </a><br/> House 5<br/>
</div>

Upvotes: 0

Views: 3307

Answers (3)

gilly3
gilly3

Reputation: 91667

Don't reuse existing script elements to inject a script into the page. Use a new script element.

function changesrc(value) { 
    var sets = document.createElement("script");    
    switch (value) { 
        case '1': sets.src = 'sidescroll.js'; break; 
        case '2': sets.src = 'sidescroll2.js'; break; 
    } 
    document.body.appendChild(sets);
}

Upvotes: 0

James Fair
James Fair

Reputation: 592

Well, I see that you dont have value defined. Try this

function changesrc(value) {
var sets = document.getElementById('newset');   
switch (value) {
 case '1': sets.src = 'sidescroll.js'; break;
 case '2': sets.src = 'sidescroll2.js'; break;
      }
    }

You basically forgot to include an argument

Upvotes: 1

faino
faino

Reputation: 3224

You need to include the argument when you build the function, try this:

function changesrc(value) {
    var sets=document.getElementById('newset');   
    switch(value) {
        case(1):
            sets.src='sidescroll.js';
            break;
        case(2):
        default:
            sets.src='sidescroll2.js';
    }
}

Upvotes: 2

Related Questions