diff --git a/js/functions.js b/js/functions.js
index d09109f65..b163fede9 100644
--- a/js/functions.js
+++ b/js/functions.js
@@ -401,22 +401,26 @@ var row_class = 'even';
 
 function showDetails(i, update_size, insert_size, remove_size, insert_index, remove_index, img_obj, table_name)
 {
-    // The path of the image is split to facilitate comparison
-    var relative_path = (img_obj.src).split("themes/");
+    // a jQuery object
+    var $img = $(img_obj);
+
+    $img.toggleClass('selected');
 
     // The image source is changed when the showDetails function is called.
-    if (relative_path[1] == 'original/img/new_data_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_data_selected_hovered.jpg";
-        img_obj.alt = PMA_messages['strClickToUnselect'];  //only for IE browser
-    } else if (relative_path[1] == 'original/img/new_struct_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_struct_selected_hovered.jpg";
-        img_obj.alt = PMA_messages['strClickToUnselect'];
-    } else if (relative_path[1] == 'original/img/new_struct_selected_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_struct_hovered.jpg";
-        img_obj.alt = PMA_messages['strClickToSelect'];
-    } else if (relative_path[1] == 'original/img/new_data_selected_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_data_hovered.jpg";
-        img_obj.alt = PMA_messages['strClickToSelect'];
+    if ($img.hasClass('selected')) {
+        if ($img.hasClass('struct_img')) {
+            $img.attr('src', pmaThemeImage + 'new_struct_selected.jpg');
+        }
+        if ($img.hasClass('data_img')) {
+            $img.attr('src', pmaThemeImage + 'new_data_selected.jpg');
+        }
+    } else {
+        if ($img.hasClass('struct_img')) {
+            $img.attr('src', pmaThemeImage + 'new_struct.jpg');
+        }
+        if ($img.hasClass('data_img')) {
+            $img.attr('src', pmaThemeImage + 'new_data.jpg');
+        }
     }
 
     var div = document.getElementById("list");
@@ -430,8 +434,7 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
         row_class = 'even';
     }
     // If the red or green button against a table name is pressed then append a new row to show the details of differences of this table.
-    if ((relative_path[1] != 'original/img/new_struct_selected_hovered.jpg') && (relative_path[1] != 'original/img/new_data_selected_hovered.jpg')) {
-
+    if ($img.hasClass('selected')) {
         var newRow = document.createElement("tr");
         newRow.setAttribute("class", row_class);
         newRow.className = row_class;
@@ -469,7 +472,7 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
         insert_rows.align = "center";
 
         var tick_image = document.createElement("img");
-        tick_image.src = "./themes/original/img/s_success.png";
+        tick_image.src = pmaThemeImage + "s_success.png";
 
         if (update_size == '' && insert_size == '' && remove_size == '') {
           /**
@@ -562,7 +565,7 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
         }
         table_body.appendChild(newRow);
 
-    } else if ((relative_path[1] != 'original/img/new_struct_hovered.jpg') && (relative_path[1] != 'original/img/new_data_hovered.jpg')) {
+    } else {
       //The case when the row showing the details need to be removed from the table i.e. the difference button is deselected now.
         var table_rows = table_body.getElementsByTagName("tr");
         var j;
@@ -589,35 +592,6 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
     }
 }
 
-/**
- * Changes the image on hover effects
- *
- * @param   img_obj   the image object whose source needs to be changed
- *
- */
-function change_Image(img_obj)
-{
-     var relative_path = (img_obj.src).split("themes/");
-
-    if (relative_path[1] == 'original/img/new_data.jpg') {
-        img_obj.src = "./themes/original/img/new_data_hovered.jpg";
-    } else if (relative_path[1] == 'original/img/new_struct.jpg') {
-        img_obj.src = "./themes/original/img/new_struct_hovered.jpg";
-    } else if (relative_path[1] == 'original/img/new_struct_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_struct.jpg";
-    } else if (relative_path[1] == 'original/img/new_data_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_data.jpg";
-    } else if (relative_path[1] == 'original/img/new_data_selected.jpg') {
-        img_obj.src = "./themes/original/img/new_data_selected_hovered.jpg";
-    } else if(relative_path[1] == 'original/img/new_struct_selected.jpg') {
-        img_obj.src = "./themes/original/img/new_struct_selected_hovered.jpg";
-    } else if (relative_path[1] == 'original/img/new_struct_selected_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_struct_selected.jpg";
-    } else if (relative_path[1] == 'original/img/new_data_selected_hovered.jpg') {
-        img_obj.src = "./themes/original/img/new_data_selected.jpg";
-    }
-}
-
 /**
  * Generates the URL containing the list of selected table ids for synchronization and
  * a variable checked for confirmation of deleting previous rows from target tables
diff --git a/js/messages.php b/js/messages.php
index 9da01ca05..0f7c8c7c6 100644
--- a/js/messages.php
+++ b/js/messages.php
@@ -126,6 +126,9 @@ foreach ($js_messages as $name => $js_message) {
 /* Calendar */
 echo "var themeCalendarImage = '" . $GLOBALS['pmaThemeImage'] . 'b_calendar.png' . "';\n";
 
+/* Image path */
+echo "var pmaThemeImage = '" . $GLOBALS['pmaThemeImage'] . "';\n";
+
 /* Version */
 echo "var pmaversion = '" . PMA_VERSION . "';\n";
 
diff --git a/js/server_synchronize.js b/js/server_synchronize.js
index b360d1564..244feff0e 100644
--- a/js/server_synchronize.js
+++ b/js/server_synchronize.js
@@ -23,5 +23,54 @@ $(document).ready(function() {
             $(this).closest('tbody').find('.server-pass').val('');
             $(this).closest('tbody').find('.server-db').val(parts[4])
         }
-        });
+    });
+
+    $('.struct_img').hover( 
+        // pmaThemeImage comes from js/messages.php
+        function() {
+            // mouse enters the element
+            var $img = $(this);
+            $img.addClass('hover');
+            if ($img.hasClass('selected')) {
+                $img.attr('src', pmaThemeImage + 'new_struct_selected_hovered.jpg');
+            } else {
+                $img.attr('src', pmaThemeImage + 'new_struct_hovered.jpg');
+            }
+        },
+        function() {
+            // mouse leaves the element
+            var $img = $(this);
+            $img.removeClass('hover');
+            if ($img.hasClass('selected')) {
+                $img.attr('src', pmaThemeImage + 'new_struct_selected.jpg');
+            } else {
+                $img.attr('src', pmaThemeImage + 'new_struct.jpg');
+            }
+        }
+    );
+
+    $('.data_img').hover( 
+        // pmaThemeImage comes from js/messages.php
+        function() {
+            // mouse enters the element
+            var $img = $(this);
+            $img.addClass('hover');
+            if ($img.hasClass('selected')) {
+                $img.attr('src', pmaThemeImage + 'new_data_selected_hovered.jpg');
+            } else {
+                $img.attr('src', pmaThemeImage + 'new_data_hovered.jpg');
+            }
+        },
+        function() {
+            // mouse leaves the element
+            var $img = $(this);
+            $img.removeClass('hover');
+            if ($img.hasClass('selected')) {
+                $img.attr('src', pmaThemeImage + 'new_data_selected.jpg');
+            } else {
+                $img.attr('src', pmaThemeImage + 'new_data.jpg');
+            }
+        }
+    );
+
 });
diff --git a/server_synchronize.php b/server_synchronize.php
index b49aa9e4e..2c095de80 100644
--- a/server_synchronize.php
+++ b/server_synchronize.php
@@ -277,6 +277,7 @@ if ((isset($_REQUEST['submit_connect']))) {
             */
             PMA_syncDisplayHeaderSource($src_db);
             $odd_row = false;
+
             /**
             * Display the matching tables' names and difference, first
             */
@@ -339,8 +340,8 @@ if ((isset($_REQUEST['submit_connect']))) {
                 */
                 if (($num_alter_cols > 0) || ($num_insert_cols > 0) || ($num_remove_cols > 0) || ($num_add_index > 0) || ($num_remove_index > 0)) {
 
-                   echo '<img class="icon" src="' . $pmaThemeImage . 'new_struct.jpg" width="29"  height="29"
-                   alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                   echo '<img class="icon struct_img" src="' . $pmaThemeImage . 'new_struct.jpg" width="29"  height="29"
+                   alt="' . __('Click to select') . '"
                    onclick="showDetails(' . "'MS" . $i . "','" . $num_alter_cols . "','" .$num_insert_cols .
                    "','" . $num_remove_cols . "','" . $num_add_index . "','" . $num_remove_index . "'"
                    . ', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')"/>';
@@ -351,8 +352,8 @@ if ((isset($_REQUEST['submit_connect']))) {
                 if (isset($update_array[$i]) || isset($insert_array[$i])) {
                     if (isset($update_array[$i][0][$matching_tables_keys[$i][0]]) || isset($insert_array[$i][0][$matching_tables_keys[$i][0]])) {
 
-                        echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
-                        alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                        echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
+                        alt="' . __('Click to select') . '"
                          onclick="showDetails('. "'MD" . $i . "','" . $num_of_updates . "','" . $num_of_insertions .
                          "','" . null . "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')" />';
                     }
@@ -367,15 +368,15 @@ if ((isset($_REQUEST['submit_connect']))) {
                 $odd_row = PMA_syncDisplayBeginTableRow($odd_row);
                 echo '<td> + ' . htmlspecialchars($source_tables_uncommon[$j]) . '</td> ';
 
-                echo '<td align="center"><img class="icon" src="' . $pmaThemeImage .  'new_struct.jpg" width="29"  height="29"
-                alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                echo '<td align="center"><img class="icon struct_img" src="' . $pmaThemeImage .  'new_struct.jpg" width="29"  height="29"
+                alt="' . __('Click to select') . '"
                 onclick="showDetails(' . "'US" . $j . "','" . null . "','" . null . "','" . null . "','" . null . "','" . null . "'" . ', this ,'
                 . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')"/>';
 
                 if ($row_count[$j] > 0)
                 {
-                    echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
-                    alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                    echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
+                    alt="' . __('Click to select') . '"
                     onclick="showDetails(' . "'UD" . $j . "','" . null . "','" . $row_count[$j] . "','" . null .
                     "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')" />';
                 }
@@ -733,8 +734,8 @@ if (isset($_REQUEST['Table_ids'])) {
         }
 
         if (($num_alter_cols > 0) || ($num_insert_cols > 0) || ($num_remove_cols > 0) || ($num_add_index > 0) || ($num_remove_index > 0)) {
-            echo '<img class="icon" src="' . $pmaThemeImage .  'new_struct.jpg" width="29"  height="29"
-            alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+            echo '<img class="icon struct_img" src="' . $pmaThemeImage .  'new_struct.jpg" width="29"  height="29"
+            alt="' . __('Click to select') . '" 
             onclick="showDetails(' . "'MS" . $i . "','" . $num_alter_cols . "','" . $num_insert_cols . "','" . $num_remove_cols . "','" . $num_add_index . "','" . $num_remove_index . "'" .',
             this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')"/>';
         }
@@ -761,8 +762,8 @@ if (isset($_REQUEST['Table_ids'])) {
 
             if ((isset($matching_tables_keys[$i][0]) && isset($update_array[$i][0][$matching_tables_keys[$i][0]]))
                 || (isset($matching_tables_keys[$i][0]) && isset($insert_array[$i][0][$matching_tables_keys[$i][0]]))) {
-                echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
-                alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
+                alt="' . __('Click to select') . '"
                 onclick="showDetails(' . "'MD" . $i . "','" . $num_of_updates . "','" . $num_of_insertions .
                 "','" . null . "','" . null . "','" . null . "'" .', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')" />';
             }
@@ -789,8 +790,8 @@ if (isset($_REQUEST['Table_ids'])) {
         */
         if (!(in_array($j, $uncommon_table_structure_diff))) {
             if (isset($uncommon_tables[$j])) {
-                echo '<img class="icon" src="' . $pmaThemeImage  . 'new_struct.jpg" width="29"  height="29"
-                alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                echo '<img class="icon struct_img" src="' . $pmaThemeImage  . 'new_struct.jpg" width="29"  height="29"
+                alt="' . __('Click to select') . '"
                 onclick="showDetails(' . "'US" . $j . "','" . null . "','" . null . "','" . null . "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')"/>' .' ';
             }
         } else {
@@ -801,8 +802,8 @@ if (isset($_REQUEST['Table_ids'])) {
         */
         if (!(in_array($j, $uncommon_table_data_diff))) {
             if (isset($row_count[$j]) && ($row_count > 0)) {
-                echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
-                alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);"
+                echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
+                alt="' . __('Click to select') . '" 
                 onclick="showDetails(' . "'UD" . $j . "','" . null ."','" . $row_count[$j] ."','"
                 . null . "','" . null . "','" . null . "'" . ', this ,' . "'". htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')" />';
             }