问题描述:
窗口中代码如下:
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" >Search</a>
当窗口有滚动条时,按钮本身随滚动条滚动,而图标和文本“search”不随之滚动,但当你把单击下图标,图标迅速滑落到按钮本身的位置,请问是什么原因,是慢的原因么?
linkbutton不会随窗口滚动的,你自己加的代码?
你看下官网的示例Basic LinkButton
看看在你的浏览器上会不会也是同样的情况,如果是,那么可能是浏览器的问题。如果正常的,那是不是你的按钮还有其他的样式或者代码控制。
贴一下测试代码吧,运行时候,调整窗口,观察west区域的变化:
<!DOCTYPE html>
Search
Print
Reload
Help
Search
Print
Reload
Help
Search
Print
Reload
Help
Help
Search
Print
Reload
Help
这次粘贴成功
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset="UTF-8">
<title>Basic LinkButton - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="themes/bootstrap/easyui.css" />
<link rel="stylesheet" type="text/css" href="themes/icon.css" />
<script type="text/javascript" src="jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<script type="text/javascript" src="locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
AddUser()
{
$('#divFrm').show()
}
DeleteUser()
{
$('#divFrm').hide()
}
</script>
</head>
<body class="easyui-layout">
<div id="pmenu" data-options="region:'west',split:true,border:false" style="width: 200px; overflow: hidden; min-width:200px">
<div class="easyui-panel" title="用户组菜单" data-options="border:false,fit:true" style="border-bottom: 1px solid #ccc">
<div id="body" runat="server">
<div id="aButtons" >
<a id="newbtn" title="新建用户" href="#" class="easyui-linkbutton" iconcls="icon-add"
plain="true" onclick="javascript:AddUser();">新建用户</a> <a id="removebtn" title="删除用户"
href="#" class="easyui-linkbutton" plain="true" iconcls="icon-no"
onclick="javascript:DeleteUser();">删除用户</a>
</div>
<div class="div-sep" style="width: auto;"></div>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width:80px">Search</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-print'" style="width:80px">Print</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" style="width:80px">Reload</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help'" style="width:80px">Help</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width:80px">Search</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-print'" style="width:80px">Print</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" style="width:80px">Reload</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help'" style="width:80px">Help</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width:80px">Search</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-print'" style="width:80px">Print</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" style="width:80px">Reload</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help'" style="width:80px">Help</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help'" style="width:80px">Help</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width:80px">Search</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-print'" style="width:80px">Print</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" style="width:80px">Reload</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help'" style="width:80px">Help</a>
</div>
</div>
</div>
<div id="divFrm" data-options="region:'center',split:true,border:false,buttons:'#dlg-buttons'"
style="padding: 5px; display: none" align="center">
<div style="width: 600px; height: 400px; padding-top: 35px;">
<div class="ftitle">
用户基本信息</div>
<form id="ff" method="post" novalidate>
<div class="fitem">
<label>
用户ID:</label>
<input type="text" name="UserID" id="UserID" data-options="required:true"
readonly="readonly" style="width: 210px;" />
</div>
<div class="fitem">
<label>
用户名称:</label>
<input class="easyui-validatebox" type="text" name="UserName" id="UserName"
data-options="required:true" style="width: 210px;" />
</div>
<div class="fitem">
<label>
所在部门:</label>
<input id="IDepartment" name="IDepartment" style="width: 210px;" data-options="required:true"
readonly="readonly" />
</div>
<div class="fitem">
<label>
用户组成员:</label>
<select class="easyui-combobox" id="GpUser" name="GpUser" style="width: 230px;
overflow: scroll;" data-options="panelHeight:200,multiple:true">
</select>
<%-- <input class="easyui-combobox" id="projGpUser" name="projGpUser" style="width: 230px " data-options="panelHeight:'auto',panelWidth:'100px'" />--%>
</div>
</form>
<div class="buttonStyle" id="dlg-buttons">
<a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-save" onclick="SaveProjectGroup()"
align="left" style="padding-right: 30px;">保存</a> <a href="javascript:void(0)" class="easyui-linkbutton"
iconcls="icon-cancel" onclick="javascript:$('#divFrm').hide()" align="right"
style="margin-left: 30px;">取消</a>
</div>
</div>
</div>
</body>
</html>