How to bind click event to object tag?

Question

I have this code

and jquery

Answer 1

The easiest way to accomplish this goal is to wrap the object tag in a div, bind the click listener to the div, and add pointer-events: none to the object tag's styles.

Sample fiddle:

.clickable {
  background: red;
  width: 100px;
  height: 100px;
  border-radius: 100px;
  overflow: hidden;
}

object {
  width: 100%;
  pointer-events: none;
}