Example of Creating the Button with an Image

To execute the example, add links to the PP.js library and to the tables of the PP.css visual styles. The ImgBtn1.png file must be stored on one level with the HTML page.

Further the Javascript code example is given with the help of which the Button component is placed on the HTML page:

<script type="text/javascript">

function MyClass(data)//The DblClick event handler;

{

      this.data = data;

      this.btnOnDblClick = function (sender, args)

{

alert("Button Image is pressed");

}

}

var m = new MyClass(Event handling context is true);

var b1 = new PP.Ui.Button({

    ParentNode: document.getElementById("MyButton"),

    Content: "Image",

    ImageUrl: ImgBtn1.png,//path to the image

    DblClick: m.btnOnDblClick

    });

</script>

After executing the example the HTML page contains a button with image that looks as follows:

The Button Image is presses message is displayed on double click.

See also:

Button