diff --git a/frappe/public/css/list.css b/frappe/public/css/list.css
index 072726590d..eb56bd463a 100644
--- a/frappe/public/css/list.css
+++ b/frappe/public/css/list.css
@@ -213,10 +213,27 @@ table.field-info {
padding-bottom: 0px !important;
}
+.zoom-view {
+ top: 10px !important;
+ right: 10px !important;
+ width: 36px;
+ height: 36px;
+ opacity: 0;
+ font-size: 20px;
+ color: black;
+ position: absolute;
+ padding: 0px !important;
+ border-radius: 20px;
+}
+
.image-field {
position: relative;
}
.image-field:hover .field-info {
opacity: 0.9;
+}
+
+.image-field:hover .zoom-view {
+ opacity: 1;
}
\ No newline at end of file
diff --git a/frappe/public/js/frappe/list/image_view_item_row.html b/frappe/public/js/frappe/list/image_view_item_row.html
index 4a01797604..603ab340a1 100644
--- a/frappe/public/js/frappe/list/image_view_item_row.html
+++ b/frappe/public/js/frappe/list/image_view_item_row.html
@@ -7,21 +7,26 @@
diff --git a/frappe/public/js/frappe/ui/listing.js b/frappe/public/js/frappe/ui/listing.js
index a91aea5ae1..817a3fdae1 100644
--- a/frappe/public/js/frappe/ui/listing.js
+++ b/frappe/public/js/frappe/ui/listing.js
@@ -344,7 +344,8 @@ frappe.ui.Listing = Class.extend({
var gallery = frappe.render_template("blueimp-gallery", {});
$(gallery).appendTo(me.$w);
- me.$w.find(".image-field").click(function(event){
+ me.$w.find(".zoom-view").click(function(event){
+ event.preventDefault();
opts = {
doctype: me.doctype,
docname: $(event.target).attr('data-name'),