Cyb

css/jquery.reject.css

@@ -29,6 +29,7 @@
 	font-size: 12px;
 	background: #FFF;
 	border: 1px solid #CCC;
+	border-radius: 8px;
 	color: #4F4F4F;
 	margin: 0 auto;
 	height: auto;
@@ -97,6 +98,7 @@
 	clear: both;
 	padding: 0;
 	margin: 0;
+	float: right;
 }
 
 #jr_close a {
@@ -112,3 +114,16 @@
 	padding: 10px 0 0 0;
 	margin: 0;
 }
+
+.clear {
+	clear: both;
+}
+
+.noselect {
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	-o-user-select: none;
+	user-select: none;
+	cursor: default;
+}

js/jquery.reject.js

@@ -75,7 +75,7 @@ $.reject = function(options) {
 		// Message displayed below closing link
 		closeMessage: 'By closing this window you acknowledge that your experience '+
 						'on this website may be degraded',
-		closeLink: 'Close This Window',
+		closeTitle: 'Close This Window',
 		closeURL: '#',
 
 		// Allows closing of window with esc key
@@ -95,6 +95,8 @@ $.reject = function(options) {
 
 		// Path where images are located
 		imagePath: './images/',
+		// File extension of images
+		imageFileExtension: 'gif',
 		// Background color for overlay
 		overlayBgColor: '#000',
 		// Background transparency (0-1)
@@ -216,8 +218,18 @@ $.reject = function(options) {
 	// Load background overlay (jr_overlay) + Main wrapper (jr_wrap) +
 	// Inner Wrapper (jr_inner) w/ opts.header (jr_header) +
 	// opts.paragraph1/opts.paragraph2 if set
-	var html = '<div id="jr_overlay"></div><div id="jr_wrap"><div id="jr_inner">'+
-		'<h1 id="jr_header">'+opts.header+'</h1>'+
+	var html = '<div id="jr_overlay"></div><div id="jr_wrap"><div id="jr_inner" class="noselect">';
+
+	// Display close button
+	html += '<div id="jr_close">';
+	if(opts.close) {
+		html += '<a href="' + opts.closeURL + '">'
+			  + '<img src="' + opts.imagePath + 'close.' + opts.imageFileExtension + '" alt="' + opts.closeTitle + '" title="' + opts.closeTitle + '">'
+			  + '</a>';
+	}
+	html += '</div>';
+
+	html += '<h1 id="jr_header">'+opts.header+'</h1>'+
 		(opts.paragraph1 === '' ? '' : '<p>'+opts.paragraph1+'</p>')+
 		(opts.paragraph2 === '' ? '' : '<p>'+opts.paragraph2+'</p>');
 
@@ -250,13 +262,12 @@ $.reject = function(options) {
 		html += '</ul>';
 	}
 
-	// Close list and #jr_list
-	html += '<div id="jr_close">'+
-	// Display close links/message if set
-	(opts.close ? '<a href="'+opts.closeURL+'">'+opts.closeLink+'</a>'+
-		'<p>'+opts.closeMessage+'</p>' : '')+'</div>'+
+	// Display close message
+	html += '<div>' + (opts.close ? '<p>'+opts.closeMessage+'</p>' : '') + '</div>';
+	html += '<div class="clear"></div>';
+
 	// Close #jr_inner and #jr_wrap
-	'</div></div>';
+	html += '</div></div>';
 
 	var element = $('<div>'+html+'</div>'); // Create element
 	var size = _pageSize(); // Get page size
@@ -364,16 +375,16 @@ $.reject = function(options) {
 	});
 
 	element.find('#jr_inner li').css({ // Browser list items (li)
-		background: 'transparent url("'+opts.imagePath+'background_browser.gif") '+
+		background: 'transparent url("'+opts.imagePath+'background_browser.' + opts.imageFileExtension + '") '+
 					'no-repeat scroll left top'
 	});
 
 	element.find('#jr_inner li .jr_icon').each(function() {
 		// Dynamically sets the icon background image
 		var self = $(this);
 		self.css('background','transparent url('+opts.imagePath+'browser_'+
-				(self.parent('li').attr('id').replace(/jr_/,''))+'.gif)'+
-					' no-repeat scroll left top');
+				(self.parent('li').attr('id').replace(/jr_/,''))+'.' + opts.imageFileExtension + ')'+
+					' no-repeat scroll center center');
 
 		// Send link clicks to openBrowserLinks
 		self.click(function () {