その他の実用的な関数
1034:Element.CSS_PROPERTIES = $w(
1035: 'backgroundColor backgroundPosition borderBottomColor borderBottomStyle ' +
1036: 'borderBottomWidth borderLeftColor borderLeftStyle borderLeftWidth ' +
1037: 'borderRightColor borderRightStyle borderRightWidth borderSpacing ' +
1038: 'borderTopColor borderTopStyle borderTopWidth bottom clip color ' +
1039: 'fontSize fontWeight height left letterSpacing lineHeight ' +
1040: 'marginBottom marginLeft marginRight marginTop markerOffset maxHeight '+
1041: 'maxWidth minHeight minWidth opacity outlineColor outlineOffset ' +
1042: 'outlineWidth paddingBottom paddingLeft paddingRight paddingTop ' +
1043: 'right textIndent top width wordSpacing zIndex');
1044:
1045:Element.CSS_LENGTH = /^(([\+\-]?[0-9\.]+)(em|ex|px|in|cm|mm|pt|pc|\%))|0$/;
1046:
1034~1044行目のElement.
1045行目で,
String. prototype. parseStyle
1047:String.__parseStyleElement = document.createElement('div');
1048:String.prototype.parseStyle = function(){
1049: var style, styleRules = $H();
1050: if (Prototype.Browser.WebKit)
1051: style = new Element('div',{style:this}).style;
1052: else {
1053: String.__parseStyleElement.innerHTML = '<div style="' + this + '"></div>';
1054: style = String.__parseStyleElement.childNodes[0].style;
1055: }
1056:
1057: Element.CSS_PROPERTIES.each(function(property){
1058: if (style[property]) styleRules.set(property, style[property]);
1059: });
1060:
1061: if (Prototype.Browser.IE && this.include('opacity'))
1062: styleRules.set('opacity', this.match(/opacity:\s*((?:0|1)?(?:\.\d*)?)/)[1]);
1063:
1064: return styleRules;
1065:};
1066:
1048~1066行目のparseStyleは,
1047行目で,
1050行目で,
1053行目で,
1057行目で,
1061行目で,
Element. getStyles
1067:if (document.defaultView && document.defaultView.getComputedStyle) {
1068: Element.getStyles = function(element) {
1069: var css = document.defaultView.getComputedStyle($(element), null);
1070: return Element.CSS_PROPERTIES.inject({ }, function(styles, property) {
1071: styles[property] = css[property];
1072: return styles;
1073: });
1074: };
1075:} else {
1076: Element.getStyles = function(element) {
1077: element = $(element);
1078: var css = element.currentStyle, styles;
1079: styles = Element.CSS_PROPERTIES.inject({ }, function(results, property) {
1080: results[property] = css[property];
1081: return results;
1082: });
1083: if (!styles.opacity) styles.opacity = element.getOpacity();
1084: return styles;
1085: };
1086:};
1087:
1067~1087行目のgetStylesは,
1068行目で,
1069行目で,
1070行目で,
1076行目で,
1078行目で,
1079行目で,
1083行目で,
1084行目で,
エフェクトをElementクラスのメソッドにする
addMethodsメソッドを使います。
1088:Effect.Methods = {
1089: morph: function(element, style) {
1090: element = $(element);
1091: new Effect.Morph(element, Object.extend({ style: style }, arguments[2] || { }));
1092: return element;
1093: },
1094: visualEffect: function(element, effect, options) {
1095: element = $(element)
1096: var s = effect.dasherize().camelize(), klass = s.charAt(0).toUpperCase() + s.substring(1);
1097: new Effect[klass](element, options);
1098: return element;
1099: },
1100: highlight: function(element, options) {
1101: element = $(element);
1102: new Effect.Highlight(element, options);
1103: return element;
1104: }
1105:};
1106:
1107:$w('fade appear grow shrink fold blindUp blindDown slideUp slideDown '+
1108: 'pulsate shake puff squish switchOff dropOut').each(
1109: function(effect) {
1110: Effect.Methods[effect] = function(element, options){
1111: element = $(element);
1112: Effect[effect.charAt(0).toUpperCase() + effect.substring(1)](element, options);
1113: return element;
1114: }
1115: }
1116:);
1117:
1118:$w('getInlineOpacity forceRerendering setContentZoom collectTextNodes collectTextNodesIgnoreClass getStyles').each(
1119: function(f) { Effect.Methods[f] = Element[f]; }
1120:);
1121:
1122:Element.addMethods(Effect.Methods);
1088~1122行目で,
1089~1093行目で,
1094行目で,
1096行目で,
1097行目で,
1100~1104行目で,
1107~1116行目で,
1118~1120行目で,
1122行目で,