问个简单的有关问题 献丑鸟- -哈哈
日期：2014-05-17 浏览次数：20620 次
问个简单的问题 献丑鸟- -哈哈
<td valign="top" class="FolderToolbarContainer" style="overflow: auto; width: 100%;
background: #fff;">
<asp:Panel runat="server" ID="PanelCatalog" Style="font-size: 9pt">
<span runat="server" style="text-align: center; vertical-align: middle;">
<p title="收藏的知识">
<img src="/Document/Public/Images/ModuleIcons/Recommend.gif" />
收藏的知识:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="推荐的知识">
<img src="/Document/Public/Images/ModuleIcons/SignItem.gif" />
推荐的知识:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="知识学习">
<img src="../../Public/Images/ModuleIcons/StudyItem.gif" />
知识学习:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="我创建的知识">
<img src="../../Public/Images/ModuleIcons/MyKnowledge.gif" />
我创建的知识:
</p>
</span>
</asp:Panel>
</td>
P标签用的很少 我想实现的效果是 p标签如何实现像a标签一样鼠标移上去变色 点击选中变色 还有P标签是否可以点击时候传ID?
------解决方案--------------------
jquery 轻松实现
<td valign="top" class="FolderToolbarContainer" style="overflow: auto; width: 100%;
background: #fff;">
<asp:Panel runat="server" ID="PanelCatalog" Style="font-size: 9pt">
<span runat="server" style="text-align: center; vertical-align: middle;">
<p title="收藏的知识">
<img src="/Document/Public/Images/ModuleIcons/Recommend.gif" />
收藏的知识:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="推荐的知识">
<img src="/Document/Public/Images/ModuleIcons/SignItem.gif" />
推荐的知识:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="知识学习">
<img src="../../Public/Images/ModuleIcons/StudyItem.gif" />
知识学习:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="我创建的知识">
<img src="../../Public/Images/ModuleIcons/MyKnowledge.gif" />
我创建的知识:
</p>
</span>
</asp:Panel>
</td>
P标签用的很少 我想实现的效果是 p标签如何实现像a标签一样鼠标移上去变色 点击选中变色 还有P标签是否可以点击时候传ID?
------解决方案--------------------
jquery 轻松实现
- HTML code
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<style type="text/css">
.hover{background:#00F;}
.click{background:#F00;}
</style>
<script type="text/javascript">
$(function(){
$("p").hover(function(){
$(this).addClass("hover");
},function(){
$(this).removeClass("hover");
}).click(function(){
$(this).toggleClass("click");
})
})
</script>
</head>
<body>
<p title="收藏的知识">
<img src="/Document/Public/Images/ModuleIcons/Recommend.gif" />
收藏的知识:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="推荐的知识">
<img src="/Document/Public/Images/ModuleIcons/SignItem.gif" />
推荐的知识:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="知识学习">
<img src="../../Public/Images/ModuleIcons/StudyItem.gif" />
知识学习:
</p>
</span><span runat="server" style="text-align: center; vertical-align: middle;">
<p title="我创建的知识">
<img src="../../Public/Images/ModuleIcons/MyKnowledge.gif" />
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
