diff --git a/index.html b/index.html
index 4a93205..2dc15b1 100644
--- a/index.html
+++ b/index.html
@@ -76,7 +76,6 @@
 				custom_class: 'bar-milestone'
 			},
 		]
-
 		var gantt_chart = new Gantt(".gantt-target", tasks, {
 			on_click: function (task) {
 				console.log(task);
diff --git a/src/bar.js b/src/bar.js
index 6befb8f..7c03ec3 100644
--- a/src/bar.js
+++ b/src/bar.js
@@ -175,7 +175,7 @@ export default class Bar {
     }
 
     setup_click_event() {
-        $.on(this.group, 'focus click', e => {
+        $.on(this.group, 'focus ' + this.gantt.options.popup_trigger, e => {
             if (this.action_completed) {
                 // just finished a move action, wait for a few seconds
                 return;
@@ -184,7 +184,7 @@ export default class Bar {
             if (e.type === 'click') {
                 this.gantt.trigger_event('click', [this.task]);
             }
-
+            
             this.gantt.unselect_all();
             this.group.classList.toggle('active');
 
diff --git a/src/index.js b/src/index.js
index ee0929d..51bbb9d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -54,6 +54,7 @@ export default class Gantt {
             padding: 18,
             view_mode: 'Day',
             date_format: 'YYYY-MM-DD',
+            popup_trigger: 'click',
             custom_popup_html: null
         };
         this.options = Object.assign({}, default_options, options);
@@ -571,7 +572,7 @@ export default class Gantt {
     }
 
     bind_grid_click() {
-        $.on(this.$svg, 'click', '.grid-row, .grid-header', () => {
+        $.on(this.$svg, this.options.popup_trigger, '.grid-row, .grid-header', () => {
             this.unselect_all();
             this.hide_popup();
         });