height : 100%;\r
overflow : hidden;\r
margin : 0;\r
- padding : 0;/* opera 8 */\r
+ padding : 0; /* opera 8 */\r
border : 0;\r
}\r
\r
+ body {\r
+ background : #111;\r
+ color : #eee;\r
+ }\r
+ .js-disabled body {\r
+ background : #111 url( "../img/loading.gif" ) 50% 50% no-repeat;\r
+ }\r
+\r
.IE5x body,\r
.IE6 body,\r
.IE7 body,\r
body, textarea {\r
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',sans-serif;\r
}\r
+\r
.IE5x body, .IE5x textarea,\r
.IE6 body, .IE6 textarea, {\r
- font-family: 'MS Pゴシック',sans-serif;\r
+ font-family : 'MS Pゴシック',sans-serif;\r
}\r
\r
+\r
+/*------------------------------------------------------------------------------------\r
+ * X.UI\r
+ */\r
.Root {\r
height : 100%;\r
}\r
/* ブラウザのレイアウト機能による auto なサイズ指定は行わない */\r
overflow : hidden;\r
border-style : solid;\r
-\r
+ border-width : 0;\r
/* border-box がデフォルト \r
box-sizing : border-box;\r
-o-box-sizing : border-box;\r
/* browser bug fix */\r
\r
zoom : 1;\r
-\r
word-wrap : break-word; /* IE5.5?5?, Firefox3.5, Chrome1 Opera10.5 Safari1 */\r
white-space : pre; /* CSS 2.0 */\r
white-space : pre-wrap; /* CSS 2.1 */\r
white-space : pre-line; /* CSS 3.0 */\r
- /* white-space : -pre-wrap; Opera 4-6 */\r
white-space : -o-pre-wrap; /* Opera 7 */\r
- white-space : -moz-pre-wrap; /* Mozilla */\r
- /* white-space : -hp-pre-wrap; HP Printers */ \r
+ white-space : -moz-pre-wrap; /* Mozilla */ \r
}\r
.IE5x .Root, .IE5x .Root div,\r
.IE6 .Root, .IE6 .Root div,\r
white-space : normal/* ie系では、 float要素へ回り込みする、 white-space の効いているテキストの位置が狂う */\r
}\r
\r
-* {zoom:1}\r
+\r
\r
/*------------------------------------------------------------------------------------\r
* mouse-operation-catcher\r
*/\r
- .mouse-operation-catcher {\r
+ .mouse-operation-catcher,\r
+ .mouse-operation-catcher-scrollFix {\r
position : absolute;\r
top : 0;\r
left : 0;\r
tap-highlight-color : rgba(0,0,0,0);\r
-webkit-tap-highlight-color : rgba(0,0,0,0);\r
}\r
- .ActiveX .mouse-operation-catcher {\r
- background-color : #fff;\r
- filter : alpha( opacity=0 );\r
- }\r
/*\r
* ie では、背景を設定しないと、 mousemove が働かない。\r
* activeX 有効の場合は背景を着色して filter で透明に。\r
* background: url(4x4.gif) fixed repeat;\r
*/\r
.mouse-operation-catcher {\r
- background : url( "../img/opacity0.gif" ) fixed repeat;\r
+ background : url( "../img/opacity0.gif" ) fixed repeat;\r
+ } \r
+ \r
+ .ActiveX .mouse-operation-catcher {\r
+ background : #fff;\r
+ filter : alpha( opacity=0 );\r
}\r
-\r
-\r
-.slidein, .slideout {\r
- position : relative;\r
- width : 200px;\r
- height : 200px;\r
- margin : 1em auto;\r
- background : #000;\r
\r
- -webkit-transition : 0.5s ease-in-out; /* win safari3.2 */\r
- -webkit-transition : -webkit-transform 0.5s ease-in-out; /* win safari4 delay は指定しない */\r
- -moz-transition : -moz-transform 0.5s ease-in-out 0s;\r
- -ms-transition : -ms-transform 0.5s ease-in-out 0s;\r
- -o-transition : -o-transform 0.5s ease-in-out 0s;\r
- transition : transform 0.5s ease-in-out 0s;\r
-\r
- /* http://blog.webcreativepark.net/2012/10/19-161432.html */\r
- -webkit-backface-visibility : hidden;\r
- -moz-backface-visibility : hidden;\r
- backface-visibility : hidden;\r
-}\r
-.slidein .slider {\r
- -webkit-transform : translate(100px,0); /* win safari3.2 */\r
- -webkit-transform : translateX(100px) translateZ(0); /* safari4 */\r
- -moz-transform : translateX(100px) translateZ(0);\r
- -ms-transform : translateX(100px) translateZ(0);\r
- -o-transform : translateX(100px) translateZ(0);\r
- transform : translateX(100px) translateZ(0);\r
-}\r
-.slideout .slider {\r
- -webkit-transform : translate(0,0); /* win safari3.2 */\r
- -webkit-transform : translateX(0) translateZ(0); /* safari4 */\r
- -moz-transform : translateX(0) translateZ(0);\r
- -ms-transform : translateX(0) translateZ(0);\r
- -o-transform : translateX(0) translateZ(0);\r
- transform : translateX(0) translateZ(0);\r
-}\r
-.slider {\r
- position : absolute;\r
- top : 0;\r
- height : 0;\r
-}\r
-.slider div {\r
- position : absolute;\r
- top : 0;\r
- width : 200px;\r
- height : 200px;\r
-}\r
-.slider-red {\r
- left : 0;\r
- background : #f00;\r
-}\r
-.slider-blue {\r
- left : 200;\r
- background : #00f;\r
-}\r
-\r
+ .mouse-operation-catcher-scrollFix {\r
+ overflow : scroll;\r
+ }\r
+ .mouse-operation-catcher-scrollFix div {\r
+ width : 300%;\r
+ height : 300%;\r
+ /* background : url( "../img/grid.gif" ) repeat; */\r
+ }\r
\r
/*------------------------------------------------------------------------------------\r
* hidden-sysyem-node\r
/* Scrollbox\r
--------------------------------------------------------------------------------------*/\r
.ScrollBox-Scroller {\r
- transform : translate( 0, 0 );\r
- transformOrigin : '0 0';\r
position : absolute;\r
}\r
.Root .ScrollBox-IndicatorV,\r
.Root .ScrollBox-IndicatorH {\r
- position : absolute;\r
- overflow : hidden;\r
- background : #000;\r
- background : rgba(0,0,0,0.5);\r
- border : 0;\r
+ position : absolute;\r
+ overflow : hidden;\r
+ background : #000;\r
+ /* background : rgba(0,0,0,0.5); IE5.5 ietester でインジケーターに色がつかない、、、*/\r
}\r
.Root .ScrollBox-IndicatorV {\r
top : 0;\r
left : 0;\r
height : 0.5em;\r
}\r
+ .IE4 .ScrollBox-IndicatorH,\r
+ .IE5x .ScrollBox-IndicatorH {\r
+ line-height : 0.5;\r
+ }\r
+\r
+.IE8 * {\r
+ filter : inherit;\r
+}\r
+[ie8opcityFix] * {\r
+ filter : inherit;\r
+}\r