{"id":57,"date":"2008-02-18T21:45:05","date_gmt":"2008-02-19T03:45:05","guid":{"rendered":"http:\/\/pessoal.org\/blog\/?p=57"},"modified":"2008-02-19T08:47:05","modified_gmt":"2008-02-19T14:47:05","slug":"changing-image-src-attribute-reliably-in-internet-explorer","status":"publish","type":"post","link":"https:\/\/pessoal.org\/blog\/2008\/02\/18\/changing-image-src-attribute-reliably-in-internet-explorer\/","title":{"rendered":"Changing image src attribute reliably in Internet Explorer"},"content":{"rendered":"<p>I just spent quite a bit of time debugging this silly problem on Insightory.com, where the document control buttons were not working under Internet Explorer. Since it might be useful to somebody else, I&#8217;m going to document the solution here.<\/p>\n<p>The problem was that the document browsing control buttons, which look like the following:<\/p>\n<p><code><br \/>\n&lt;img src=\"\/blog\/browse_controls.png\" \/><br \/>\n<\/code><\/p>\n<p>They were implemented by doing something similar to this:<\/p>\n<p><code><br \/>\n&lt;a href=\"javascript:void(null);\" onClick=\"javascript:openNextPage();\" class=\"nextpage\">&lt;img src=\"\/images\/nextpagebutton.gif\" alt=\"Next page\" \/>&lt;\/a><br \/>\n<\/code><\/p>\n<p>And then inside the <tt>openNextPage<\/tt> function, I swap the image by changing the <tt>src<\/tt> attribute of the image tag. Pretty standard, and works perfectly under Firefox.<\/p>\n<p>Long story short, the <tt>javascript:void(null);<\/tt> bit is what is breaking Internet Explorer (IE6 on this case). Changing the XHTML code to look like the following fixes the problem completely for me:<\/p>\n<p><code><br \/>\n&lt;a href=\"javascript:openNextPage();\" class=\"nextpage\">&lt;img src=\"\/images\/nextpagebutton.gif\" alt=\"Next page\" \/>&lt;\/a><br \/>\n<\/code><\/p>\n<p>I found out the culprit by (obviously) searching Google for a long time, and then finding <a href=\"http:\/\/www.webdeveloper.com\/forum\/archive\/index.php\/t-99122.html\">this thread on WebDeveloper.com<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I just spent quite a bit of time debugging this silly problem on Insightory.com, where the document control buttons were not working under Internet Explorer. Since it might be useful to somebody else, I&#8217;m going to document the solution here. The problem was that the document browsing control buttons, which look like the following: &lt;img [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[19,10],"tags":[],"_links":{"self":[{"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/posts\/57"}],"collection":[{"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/comments?post=57"}],"version-history":[{"count":0,"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/posts\/57\/revisions"}],"wp:attachment":[{"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/media?parent=57"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/categories?post=57"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pessoal.org\/blog\/wp-json\/wp\/v2\/tags?post=57"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}