Web Development with jQuery®

(^78) ❘ CHAPTER 3 EVENTS
div.finderFile {
float: left;
width: 150px;
height: 100px;
overflow: hidden;
}
div.finderIcon {
background: url('images/Folder 48x48.png') no-repeat center;
background-size: 48px 48px;
height: 56px;
width: 54px;
margin: 10px auto 3px auto;
}
div.finderFile div.finderIcon {
background-image: url('images/Safari Document.png');
}
div.finderIconSelected {
background-color: rgb(204, 204, 204);
border-radius: 5px;
}
div.finderDirectoryName,
div.finderFileName {
text-align: center;
}
span.finderDirectoryNameSelected,
span.finderFileNameSelected {
background: rgb(56, 117, 215);
border-radius: 8px;
color: white;
padding: 1px 7px;
}
div#finderActions {
position: absolute;
bottom: 1px;
right: 10px;
z-index: 2 ;
}
The following JavaScript demonstrates how to apply and remove event handlers at will:
$(document).on(
'DOMContentLoaded',
function()
{
var eventHandlerActive = false;
function applyEventHandler()
{
if (eventHandlerActive)
{
return;
}
$('div#finderFiles').on(
http://www.it-ebooks.info