diff --git a/genome.css b/genome.css
index 1d3a834014..e19eca9e1c 100644
--- a/genome.css
+++ b/genome.css
@@ -762,6 +762,13 @@ input.nav {
font-size: 9px !important;
}
-div.helpDialog {
+#help_dialog {
font-size: 12px;
+ width: 70%;
+}
+#help_dialog dl {
+ width: 48%;
+}
+#help_dialog dt {
+ font-weight: bold;
}
diff --git a/js/Browser.js b/js/Browser.js
index 12fc0cc6c8..28fbf16e99 100644
--- a/js/Browser.js
+++ b/js/Browser.js
@@ -667,23 +667,30 @@ Browser.prototype.makeHelpDialog = function () {
// make a div containing our help text
var helpdiv = document.createElement('div');
helpdiv.style.display = 'none';
- helpdiv.innerHTML =
- '
'
- + '
Mouse Commands
'
- + '
'
- + '- Track pane
'
+ helpdiv.className = "helpDialog";
+ helpdiv.innerHTML = ''
+ + ''
+ + '- Moving
'
+ ''
- + ' - Click and drag in the main pane to move the view
'
- + ' - Shift-click and drag to highlight a region to zoom to
'
- + '
'
- + ' '
- + '- Overview and scale bars
'
+ + '
Clicking and draging in the track area moves the view'
+ + '
Clicking on either the overview bar or the track scale bar centers the view there'
+ + '
Shift-clicking in the track area centers the view there'
+ + ''
+ + '
Zooming'
+ '
'
- + ' - Click to center the view at that region
'
- + ' - Click and drag to highlight a region to zoom to
'
+ + ' - Clicking the "+" and "-" buttons in the navigation bar zooms the view in and out
'
+ + ' - Clicking and dragging in the overview or the track scale bar zooms to the region you select
'
+ + ' - Shift-clicking and dragging in the track area also zooms to the region you select
'
+ '
'
+ ''
- + '
'
+ + ''
+ + ''
+ + '- Searching
'
+ + ''
+ + '- Type the name of a feature or reference sequence in the search box to jump there
'
+ + '- Type a reference sequence name, optionally including a region, to jump to that region
'
+ + '
'
+ + '
'
;
this.container.appendChild( helpdiv );