在我的CSS我有:
li.sort:hover {color: #F00;}
Run Code Online (Sandbox Code Playgroud)
当DOM准备好时,类LI下的所有元素都能sort正常运行.
如果我创建一个新 LI元素(使用mootools el.addClass(classname)),我可以设置基类,但无法弄清楚如何hover向它添加类.
有任何想法吗?
查找DOM对象是否可见的最佳方法是什么?
当对象被认为不可见时的各种情况:
我用
<script type="text/javascript" src="jquery-1.2.2.pack.js"> </script>
Run Code Online (Sandbox Code Playgroud)
加载jquery,然后加载包含以下内容的外部脚本:
var jkpanel={
controltext: 'menu',
$mainpanel: null, contentdivheight: 0,
openclose:function($, speed){
this.$mainpanel.stop() //stop any animation
if (this.$mainpanel.attr('openstate')=='closed')
this.$mainpanel.animate({top: 0}, speed).attr({openstate: 'open'})
else
this.$mainpanel.animate({top: -this.contentdivheight+'px'}, speed).attr({openstate: 'closed'})
},
init:function(file, height, speed){
jQuery(document).ready(function($){
jkpanel.$mainpanel=$('<div id="dropdownpanel"><div class="contentdiv"></div><div class="control">'+jkpanel.controltext+'</div></div>').prependTo('body')
var $contentdiv=jkpanel.$mainpanel.find('.contentdiv')
var $controldiv=jkpanel.$mainpanel.find('.control').css({cursor: 'wait'})
$contentdiv.load(file, '', function($){
var heightattr=isNaN(parseInt(height))? 'auto' : parseInt(height)+'px'
$contentdiv.css({height: heightattr})
jkpanel.contentdivheight=parseInt($contentdiv.get(0).offsetHeight)
jkpanel.$mainpanel.css({top:-jkpanel.contentdivheight+'px', visibility:'visible'}).attr('openstate', 'closed')
$controldiv.css({cursor:'hand', cursor:'pointer'})
})
jkpanel.$mainpanel.click(function(){jkpanel.openclose($, speed)})
})
}
}
//Initialize script: jkpanel.init('path_to_content_file', 'height of content DIV in px', animation_duration)
jkpanel.init('1', '80px', 1000) …Run Code Online (Sandbox Code Playgroud) 有人可以帮助我将以下Jquery脚本转换为mootools等效的吗?
我需要使用Mootools来防止我的Joomla网站出现冲突问题.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('div.rj_insertcode a.glossarylink').each(function() {
jQuery(this).replaceWith(jQuery(this).html());
});
jQuery('.no_glossary a.glossarylink').each(function() {
jQuery(this).replaceWith(jQuery(this).html());
});
});
</script>
</head>
Run Code Online (Sandbox Code Playgroud)
或者,如果有人可以推荐如何使上述代码与Mootools兼容(我对两种语言都相当新),我们将不胜感激.
我也是mootools和web开发的新手.我已经阅读了这个非常酷的博客 ,我想扩展代码以连接数据库以使用php文件更新评级.但不幸的是我的代码不工作意味着数据库没有更新.有人可以解释一下为什么.非常感谢...
这是代码
star.html
<html>
<script src="mootools-1.3.js"></script>
<script src="lorenzos-MooStarRating-422072a/Source/moostarrating.js"></script>
<script>
// Configure the image paths
var MooStarRatingImages = {
defaultImageFolder: 'lorenzos-MooStarRating-422072a/Graphics/',
defaultImageEmpty: 'star_empty.png',
defaultImageFull: 'star_full.png',
defaultImageHover: "star_boxed_hover.png"
};
// Post iD
var postId = 10;
// When the DOM is ready....
window.addEvent("domready",function() {
// Create our instance
// Advanced options
var advancedRating = new MooStarRating({
form: 'ratingsForm',
radios: 'rating',
half: false,
//imageEmpty: 'star_boxed_empty.png',
//imageFull: 'star_boxed_full.png',
//imageHover: "star_boxed_hover.png",
width: 17,
tip: 'Rate <i>[VALUE] / 7.0</i>',
tipTarget: $('htmlTip'),
tipTargetType: 'html',
click: …Run Code Online (Sandbox Code Playgroud) 我使用以下RegEx在字符串中进行替换:
<\/?(span)\b(?:\s+class="highlight")?>
Run Code Online (Sandbox Code Playgroud)
但是这个正则表达式有一个缺陷...以此示例代码为例:
<p>
Some text here
<span class="highlight">This is highlighted</span>
<span>This is not highlighted</span>
</p>
Run Code Online (Sandbox Code Playgroud)
我的正则表达式将匹配两个span标签,虽然我只想要一个class ="highlight"设置.如何使用RegEx实现这一目标?
PS:请不要告诉我,我不应该使用RegEx,因为我会降低你的答案,因为它是偏离主题的.这是RegEx球员的问题.
编辑:基于下面接受的答案我使用以下正则表达式进行替换注意:代码是在javascript(mootools)
var regex = new RegExp("(<span[^>]+class\\s*=\\s*(\"|')highlight\\2[^>]*>)(.*?)(</span>)",'g');
var replaced = element.get('html').replace(regex, "$3");
element.set('html', replaced);
Run Code Online (Sandbox Code Playgroud)
上面的正则表达式将在这里用"some text here"替换一些文本(没有双引号)
我有一个烦人的问题,我相信这个问题的标题和这个例子完全可以解释
#body {
height: 300px;
width: 100%;
margin: 0;
padding: 0;
background-color: #333;
}
#container {
height: 10%;
background-color: #000;
}
.innerContainer {
width: 30%;
height: 100%;
margin: 0 9.5%;
background-color: #F00;
display: inline-block;
}
.text {
height : 100%;
line-height: 100%;
}
#button {
margin-top: 20%;
margin-left: 20%;
}
Run Code Online (Sandbox Code Playgroud) 我很好奇,浏览器查找哪个选择器会更快.我对一般而不是特定的浏览器感兴趣.
$('accountDetailsTable').getElements('.toggler')
Run Code Online (Sandbox Code Playgroud)
这将查找accountDetailsTable您正在使用document.getElementById('accountDetailsTable');,然后查找.toggler元素内部.
$$('.toggler')
Run Code Online (Sandbox Code Playgroud)
而这个将直接返回所有选择器.但最终他们都会给我相同的结果.
那么哪一个会更快?我该怎么测试呢?