我想使用zepto代替jquery ...所以我用我的web jquery替换zepto包括这个脚本
script
window.jQuery = Zepto
旅馆这个代码的和平
color.hook = function( hook ) {
var hooks = hook.split( " " );
each( hooks, function( i, hook ) {
console.dir(jQuery.cssHooks) // this gives me undefined
jQuery.cssHooks[ hook ] = {
set: function( elem, value ) {
console.log('es')
var parsed, curElem,
backgroundColor = "";
if ( value !== "transparent" && ( jQuery.type( value ) !== "string" || ( parsed = stringParse( value ) ) ) ) {
value = color( parsed || value );
if ( !support.rgba && value._rgba[ 3 ] !== 1 ) {
curElem = hook === "backgroundColor" ? elem.parentNode : elem;
while (
(backgroundColor === "" || backgroundColor === "transparent") &&
curElem && curElem.style
) {
try {
backgroundColor = jQuery.css( curElem, "backgroundColor" );
curElem = curElem.parentNode;
} catch ( e ) {
}
}
value = value.blend( backgroundColor && backgroundColor !== "transparent" ?
backgroundColor :
"_default" );
}
value = value.toRgbaString();
}
try {
elem.style[ hook ] = value;
} catch( e ) {
// wrapped to prevent IE from throwing errors on "invalid" values like 'auto' or 'inherit'
}
}
};
jQuery.fx.step[ hook ] = function( fx ) {
if ( !fx.colorInit ) {
fx.start = color( fx.elem, hook );
fx.end = color( fx.end );
fx.colorInit = true;
}
jQuery.cssHooks[ hook ].set( fx.elem, fx.start.transition( fx.end, fx.pos ) );
};
});
};
我有这个错误
Uncaught TypeError: Cannot set property 'backgroundColor' of undefined
此
$.cssHooks // gives me undefined
在jquery中我找到了这个扩展
jQuery.extend({
// Add in style property hooks for overriding the default
// behavior of getting and setting a style property
cssHooks: {
opacity: {
get: function( elem, computed ) {
if ( computed ) {
// We should always get a number back from opacity
var ret = curCSS( elem, "opacity" );
return ret === "" ? "1" : ret;
}
}
}
},
如何在zepto ???中实现jquery中的cssHooks
TNX
编辑2
我为这个问题找到了一个可行的解决方案,我自己实现了一个ccsHooks
jQuery.cssHooks=
{
opacity:
{
get: function( elem, computed )
{
if ( computed )
{
var ret = curCSS( elem, "opacity" );
return ret === "" ? "1" : ret;
}
}
}
};
jQuery.fx.step = {};
jQuery.easing = {
linear: function( p ) {
return p;
},
swing: function( p ) {
return 0.5 - Math.cos( p*Math.PI ) / 2;
}
};
var originalQsa = jQuery.zepto.qsa;
$.zepto.qsa = function(el, sel) {
try {
return originalQsa.apply(this, arguments)
} catch(e) {
console.error("invalid CSS selector: ", sel)
return []
}
}
这扩展了zepto cssHooks。这是导致所有问题的事件处理程序
$('#menu a').click(function()
{
var name=$(this).attr('id');
var div=$('div#'+name);
var visible=$('#container').find(':visible').attr('id');
$('div#'+visible).css({position:'absolute'}).hide('slide',{direction:'left'},1000,function()
{
$(div).css({position:'relative'}).show('slide',{direction:'right'},1000,function(){resetSizeGmaps()});
});
});
但是我在创建了try / catch之后跟踪了这个错误
invalid CSS selector: :visible
任何人都可以修复我的cssHooks吗?