先发个图,大家了解一下需求
那个操作菜单是一个DIV层,代码如下
<?php
foreach ($this->var['articles'] as $row)
{
echo "<tr id='row" . $row['id'] . "'>
<td align='center'><input type='checkbox' name='id' value='". $row['id'] . "' /></td>
<td align='center'>". $row['id'] . "</td>
<td align='center'><span class='status'>" . $this->getStatus($row['status']) . "</span></td>
<td> " . $row['title'] . "</td>
<td align='center'>". $row['name'] . "</td>
<td align='center'>". $row['username'] . "</td>
<td align='center'>". $row['visit'] . "</td>
<td align='center'>". $row['comment'] . "</td>
<td align='center'>". date('Y-m-d H:i:s', $row['createTime']) . "</td>
<td align='center'>
<div class='opera'>
<ul class='noMP noStyle operaMenu'>
<li><a href='?article/preview/" . $row['id'] . "'>预览修改</a></li>
<li><a href='/article/view/" . $row['id'] . $row['suffix'] . "' target='_blank'>前台查看</a></li>
<li><a href='javascript:deleteArticle(" . $row['id'] . ")'>删除文章</a></li>
<li><a href='?system/setTag/article/" . $row['id'] . "'>设置标签</a></li>
<li><a href='?article/setThumb/" . $row['id'] . "'>设缩略图</a></li>
</ul>
</div>
</td>
</tr>";
}
?>
#datalist .opera{
width: 12px;
height: 12px;
*overflow: hidden;
background: #D4D4D4
}
#datalist .operaMenu{
z-index: 9;
display: none;
position: relative;
top: 10px;
left: -65px;
width: 75px;
border: 1px solid #D4D4D4;
background: #FAFAFA
}
#datalist .operaMenu li{
display: block;
}
#datalist .operaMenu li a{
display: block;
width: 100%;
padding: 5px 0;
}
#datalist .operaMenu li a:hover{
text-align: center;
color: #333333;
text-decoration: none;
background: #D4D4D4;
}
JavaScript 代码 (没有学过JS)
$('.opera').click(function(){
$(this).children('ul').toggle()
})
//不知道怎么写,就用了个 toggle() 方法
现在是点击打开菜单,再次点击关闭菜单。我想实现鼠标滑过时打开菜单,移出菜单自动关闭菜单。
$(this).children('ul').show();
},function(){
$(this).children('ul').hide();
})
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。