Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Sep 2011
    Posts
    12
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Getting IE7 to dynamically create an image

    Hi,

    I have the following function to dynamically create an image (in this case a toolbox button):

    Code:
    function createButton(srcid,bttn)
    {
     if (bttn=='mag') {s='Magnify';h='Magnify';o='DoZoom(event,\'0\',\''+srcid+'\')';}
     if (bttn=='frz') {s='Pause';h='Freeze/Unfreeze';o='setPicture(\''+srcid+'\',0)';}
     if (bttn=='swp') {s='Swap';h='Swap maps';o='setPicture(\''+srcid+'\',2)';}
     btn=document.createElement('img');
     btn.setAttribute('src','toolbox/'+s+'.gif');
     btn.setAttribute('width','16px');
     btn.setAttribute('height','16px');
     btn.setAttribute('id',bttn+'btn_'+srcid);
     btn.setAttribute('class','button');
     btn.setAttribute('name','Toolbox');
     btn.setAttribute('title',h);
     btn.setAttribute('onclick',o);
     document.getElementById('ctrlDiv').appendChild(btn);
    }
    which works fine in IE8 and IE9, but in IE7 it refuses to pick up the style 'button'. I've even tried putting in btn.class='button' but JS throws up an error.
    If I specify the style by btn.style.position='Absolute' it picks this up OK. However, it won't respond to the onclick event either.
    I have heard that setAttribute is buggy with IE7, which is why I tried to specify each attribute directly.

    The style sheet for class button is:
    Code:
    .button
    {
     position: absolute;
     left: 5;
     top: 5;
     z-index: 1;
    }
    (BTW, no link to a website as this is local on my machine atm)

    TIA,

    Gerald.
    Last edited by gerald; 09-17-2011 at 01:27 PM. Reason: Resolved

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,529
    Thanks
    3
    Thanked 511 Times in 498 Posts
    Code:
     btn.className='button';
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • Users who have thanked vwphillips for this post:

    gerald (09-17-2011)

  • #3
    New Coder
    Join Date
    Sep 2011
    Posts
    12
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Excellent - works a treat. Ta.

    Now just need to get the image to respond to an onclick event - apparently IE7 and earlier this is not supported and needs an <a href....> around it.
    However, that doesn't explain why I have other images (not dynamically created) with an onclick event that do work on the same page...

    Cheers,

    Gerald.
    Last edited by gerald; 09-17-2011 at 01:05 PM.

  • #4
    New Coder
    Join Date
    Sep 2011
    Posts
    12
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Just changed the btn.setAttribute('onclick',o) to btn.onclick=function(){runcommand}; and this works.

    Regards,

    Gerald.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •