DIY标签有抖动是什么引起的

哥斯拉 · 发表于 2024-11-14 14:01:42

马上注册，免费下载更多dz插件网资源。

您需要登录才可以下载或查看，没有账号？立即注册

×

原来就是在顶部导航增加文字，昨天为了修改顶部导航的登录，注册，搞了一整天。

DIY标签有抖动是什么引起的 px,登录,头文件,color,left

现在出现的问题是，管理员登录后，当鼠标扫到右上角DIY标签时，整个页面都在晃动，而且diy的二级下拉菜单不能显示，只能点击进去后，再才能选择高级。
我是直接在页头文件里添加修改的，

<div class="y"> <div class="ty_login_no">  <a href="member.php?mod=logging&action=login&referer={echo rawurlencode($dreferer)}" onclick="showWindow('nav', this.href, 'get', 0)" class="login"> 登录 </a> <span class="or">or</span> <a href="member.php?mod={$_G[setting][regname]}" class="reg"> 注册 </a>  <a id="switchblind" href="javascript:;" onclick="toggleBlind(this)" title="{lang switch_blind}" class="switchblind"></a> <a href="search.php" target="_blank" class="sou"> 搜索 </a>

复制代码

css：

.ty_login_no{ margin-top:5px; position:relative;} .ty_login_no .login{ float:left; padding: 4px 16px; font-size: 14px;background-color: #439ff6; color:#fff; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;} .ty_login_no .or{ background: #393A44; color: #999; width: 20px; height: 20px; font-size:12px; line-height: 20px; text-align:center;font-family: Arial,'Times New Roman','Microsoft YaHei',SimHei; position: absolute; z-index: 2; left:40px; top:5px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;} .ty_login_no .reg{float:left; padding: 4px 16px; font-size: 14px;background-color: #58c00e; color: #fff; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; margin-left: 6px;}

复制代码

当我把diy修改成 i 或其它标签时，显示正常，但是登录与注册中间的那个or效果失效，跑到框架外了。
反正用过li；ul；包括dd;dt;能想到的，都试了下，最佳的效果就是鼠标不能扫到页头DIY处，会一闪一闪的，而且二级菜单不能显示。

高手指点一下，模板文件的代码是否正确，可有修改方法。
没金币了，就给一个哈。

©DZ插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站内容为站长个人技术研究记录或网络，不提供用户交互功能，所有内容版权归原作者所有。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
您在本站任何的赞助购买、下载、查阅、回复等行为等均表示接受并同意签订《DZ插件网免责声明协议》。
如有侵权请邮件与我们联系处理: discuzaddons@vip.qq.com 并出示相关证明以便删除。敬请谅解！

婷姐 · 发表于 2024-11-14 14:02:36

抖动？听着像是鼠标停留后的效果，查查是不是鼠标停留样式设置了啥

Discuz智能体 · 发表于 2025-3-21 08:45:59

根据你描述的问题，DIY标签抖动和二级菜单无法正常显示的情况，通常是由于CSS样式冲突或JavaScript事件冲突引起的。以下是一些可能的原因和解决方法：

### 1. **CSS样式冲突**
- 你提到在页头文件中添加了自定义的CSS样式，这些样式可能与Discuz默认的DIY标签样式产生了冲突。特别是`position`、`z-index`、`float`等属性可能会影响DIY标签的显示。
- **解决方法**：检查你的自定义CSS样式，确保它们不会影响到DIY标签的布局。你可以尝试在DIY标签的CSS样式中增加`!important`来覆盖其他样式，或者调整`z-index`的值，确保DIY标签的层级高于其他元素。

.diy {
position: relative;
z-index: 9999 !important;
}

复制代码

### 2. **JavaScript事件冲突**
- 如果你在页头文件中添加了自定义的JavaScript代码，可能会与Discuz的DIY功能产生冲突，导致DIY标签的抖动或二级菜单无法正常显示。
- **解决方法**：检查你添加的JavaScript代码，确保没有与DIY功能冲突的事件监听器。你可以尝试暂时移除自定义的JavaScript代码，看看问题是否依然存在。

### 3. **HTML结构问题**
- 你提到尝试了多种HTML标签（如`li`、`ul`、`dd`、`dt`等），但效果不理想。DIY标签的HTML结构可能对页面的布局有特殊要求，特别是涉及到浮动和定位时。
- **解决方法**：确保DIY标签的HTML结构符合Discuz的默认结构。你可以参考Discuz的默认模板文件，确保DIY标签的父元素和子元素的层级关系正确。

<div class="diy">
<a href="javascript:;" class="diy-trigger">DIY</a>
<div class="diy-dropdown">
<ul>
<li><a href="advanced.php">高级</a></li>
</ul>
</div>
</div>

复制代码

### 4. **DIY标签的JavaScript事件**
- DIY标签的显示和隐藏通常是通过JavaScript控制的。如果你修改了DIY标签的HTML结构或CSS样式，可能会导致JavaScript事件无法正确触发。
- **解决方法**：确保DIY标签的JavaScript事件能够正确触发。你可以检查浏览器的开发者工具（F12），查看是否有JavaScript错误或事件未正确绑定。

### 5. **浏览器兼容性问题**
- 不同浏览器对CSS和JavaScript的解析可能有所不同，导致DIY标签在某些浏览器中显示异常。
- **解决方法**：测试不同浏览器（如Chrome、Firefox、Edge等），看看问题是否只在特定浏览器中出现。如果是，可以针对该浏览器调整CSS样式。

### 6. **缓存问题**
- 有时候，浏览器缓存可能导致页面显示异常，特别是CSS和JavaScript文件的缓存。
- **解决方法**：清除浏览器缓存，或者强制刷新页面（Ctrl + F5），看看问题是否依然存在。

### 7. **DIY标签的默认样式**
- 你可以参考Discuz的默认样式，确保你的自定义样式不会覆盖或冲突。以下是Discuz默认的DIY标签样式：

.diy {
position: relative;
display: inline-block;
z-index: 1000;
}
.diy-trigger {
cursor: pointer;
}
.diy-dropdown {
display: none;
position: absolute;
top: 100%;
left: 0;
z-index: 1001;
}
.diy:hover .diy-dropdown {
display: block;
}

复制代码

### 总结
你可以从CSS样式、JavaScript事件、HTML结构等方面逐一排查问题。如果问题依然存在，建议你逐步回退修改，找到导致问题的具体代码段，然后针对性地进行调整。

如果你有更多具体的代码或问题细节，欢迎继续提问，我会尽力帮助你解决。
-- 本回答由人工智能 AI智能体生成，内容仅供参考，请仔细甄别。