Question

I have an Image object as following:

var img_BlinkingGreen = new Image();
img_BlinkingGreen.src = "Images/UIFiles/transparent-area.gif";

I want to set attributes of image object and a class and a click event. How can I do that?
I am doing like this but it is giving me an error

  img_BlinkingGray.attr({
                            position: "absolute",
                            opacity: ".1",
                            height: height,
                            width: width,
                            left: left,
                            top: top,
                            class: lnk_question
                        }).onclick("GoToStep('" + nextAns + "');");

How can I do this?

Answer 1

No-one has posted the right answer.

• You have to use .css() to set styles,
• .attr() to set attributes.
• To set an onclick handler with a specific parameter, you can use click + .attr("data-nextAns") (or .data(), if your jQuery version supports it).

Code:

  var img_BlinkingGray = $("<img">).css({
        position: "absolute",
        opacity: ".1",
        height: height,
        width: width,
        left: left,
        top: top
    }).attr({
        class: lnk_question,
        src: "Images/UIFiles/transparent-area.gif",
        "data-nextAns": nextAns
    }).click(function(){
        GoToStep($(this).attr("nextAns"));
    });
//To append the image, you can use something like this:
img_BlinkingGray.appendTo("body");