_fancybox.scss in compass-fancybox-plugin-1.3.1.pre.2

- old
+ new

@@ -11,10 +11,11 @@
 //
 // Dual licensed under the MIT and GPL licenses:
 //   http://www.opensource.org/licenses/mit-license.php
 //   http://www.gnu.org/licenses/gpl.html
 
+$fancy-box-preload: true !default;
 
 #fancybox-loading {
 	position: fixed;
 	top: 50%;
 	left: 50%;
@@ -31,17 +32,26 @@
 * html #fancybox-loading {	// IE6
 	position: absolute;
 	margin-top: 0;
 }
 
+.fancybox-sprite {
+  @if $fancy-box-preload {
+  	background-image: inline-image('fancybox/fancybox.png');  
+  }
+  @else {
+  	background-image: image-url('fancybox/fancybox.png');  
+  }
+}
+
 #fancybox-loading div {
+  @extend .fancybox-sprite;
 	position: absolute;
 	top: 0;
 	left: 0;
 	width: 40px;
 	height: 480px;
-	background-image: image-url('fancybox/fancybox.png');
 }
 
 #fancybox-overlay {
 	position: fixed;
 	top: 0;
@@ -108,11 +118,11 @@
 	position: absolute;
 	top: -15px;
 	right: -15px;
 	width: 30px;
 	height: 30px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px 0px;
 	cursor: pointer;
 	z-index: 1103;
 	display: none;
 }
@@ -193,11 +203,11 @@
 	float: left;
 }
 
 #fancybox-title-left {
 	padding-left: 15px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -90px;
 	background-repeat: no-repeat;
 }
 
 #fancybox-title-main {
@@ -208,11 +218,11 @@
 	color: #FFF;
 }
 
 #fancybox-title-right {
 	padding-left: 15px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -55px -90px;
 	background-repeat: no-repeat;
 }
 
 #fancybox-left, #fancybox-right {
@@ -246,16 +256,16 @@
 	z-index: 1102;
 	display: block;
 }
 
 #fancybox-left-ico {
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -30px;
 }
 
 #fancybox-right-ico {
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -60px;
 }
 
 #fancybox-left:hover, #fancybox-right:hover {
 	visibility: visible;    // IE6
@@ -288,11 +298,11 @@
 }
 
 #fancy-bg-ne {
 	top: -20px;
 	right: -20px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -162px;
 }
 
 #fancy-bg-e {
 	top: 0;
@@ -303,11 +313,11 @@
 }
 
 #fancy-bg-se {
 	bottom: -20px;
 	right: -20px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -182px; 
 }
 
 #fancy-bg-s {
 	bottom: -20px;
@@ -318,11 +328,11 @@
 }
 
 #fancy-bg-sw {
 	bottom: -20px;
 	left: -20px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -142px;
 }
 
 #fancy-bg-w {
 	top: 0;
@@ -332,10 +342,10 @@
 }
 
 #fancy-bg-nw {
 	top: -20px;
 	left: -20px;
-	background-image: image-url('fancybox/fancybox.png');
+  @extend .fancybox-sprite;
 	background-position: -40px -122px;
 }
 
 // IE
 