Include jQuery and Brosho

Include jQuery and the Brosho Plugin in your header:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="js/brosho/jquery.brosho.js"></script>

Set a custom element hover class

You can have a custom element hover class. Define it in your stylesheet or in the document itself. In this example the hover effect is a dropshadow:

.custom-hover {
  box-shadow: black 0 0 5px;
  -moz-box-shadow: black 0 0 5px;
  -webkit-box-shadow: black 0 0 5px;
}

Call the Plugin with custom options

Now you can call the Plugin when the DOM is ready with the custom options available like so:

$(document).ready(function() {
  $.fn.brosho({                           //call to the brosho plugin
    stylesheet:         'css/brosho.css', //path of the brosho stylesheet if it is not in 'js/brosho/jquery.brosho.css'
    position:           'left',           //initial position of the editor ('top', 'bottom', 'left', 'right')
    elementHoverClass:  'custom-hover',   //a custom hover class
    editorOpacity:      1                 //full opacity on editor
  });
});