<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script src="/jquery-1.3.2.js"></script>
<script>
<!--
$(function(){
$(window).load(function(){
$("div[id=newnotice]").css({"right":"0px","bottom":"1px"});
$("div[id=newnotice]").slideDown("slow");
}).scroll(function(){
$("div[id=newnotice]").css({"bottom":"0px"});
$("div[id=newnotice]").css({"right":"0px","bottom":"1px"});
}).resize(function(){
$("div[id=newnotice]").css({"bottom":""});
$("div[id=newnotice]").css({"right":"0px","bottom":"1px"});
});
$("label[id=tomin]").click(function(){
$("div[id=noticecon]","div[id=newnotice]").slideUp();
});
$("label[id=tomax]").click(function(){
$("div[id=noticecon]","div[id=newnotice]").slideDown();
});
$("label[id=toclose]").click(function(){
$("div[id=newnotice]").hide();
});
});
//scroll : 滚动时候保持在页面右侧底部.
//resize: 浏览器变化时候 保持在页面右侧底部.
-->
</script>
<style>
<!--
#newnotice {
position:absolute;
display:none;
width:250px;
border:solid #9BDF70 1px;
background-color: #F0FBEB
}
#newnotice p {
font-size:12px;
margin:1px;
padding:0px 2px 0px 5px;
background-color:#C2ECA7;
color:#666666;
height:20px;
line-height:20px;
}
#newnotice p .title {
float:left;
}
#newnotice p #bts {
display:block;
float:right;
width:48px;
height:15px;
}
#newnotice p #bts .button {
display:block;
float:left;
width:15px;
height:15px;
line-height:15px;
cursor:pointer;
}
#newnotice p #bts #tomin {
background-image:url(http://img.namipan.com/p/092113faefc3951569e84c0e71dfe4eaf884051d22010000/0/notice_button.gif);
background-position:center;
}
#newnotice p #bts #tomax {
background-image:url(http://img.namipan.com/p/092113faefc3951569e84c0e71dfe4eaf884051d22010000/0/notice_button.gif);
background-position:bottom;
}
#newnotice p #bts #toclose {
background-image:url(http://img.namipan.com/p/092113faefc3951569e84c0e71dfe4eaf884051d22010000/0/notice_button.gif);
}
#newnotice div {
font-size:12px;
margin:1px;
padding:0px 5px 0px 5px;
background-color:#FFFFFF;
color:#999999;
height:75px;
line-height:20px;
}
-->
</style>
</head>
<body>
<div id="newnotice">
<p>
<span class="title">最新公告</span>
<span id="bts">
<label class="button" id="tomin" title="最小化"> </label>
<label class="button" id="tomax" title="最大化"> </label>
<label class="button" id="toclose" title="关闭"> </label>
</span>
</p>
</div>
</body>
</html>
分享到：
相关推荐
本项目是基于jQuery和Bootstrap框架开发的通知提示组件，旨在为用户提供一个在浏览器右下角显示信息提示的功能。Bootstrap是Twitter推出的一个开源的用于前端网页开发的工具集，特别注重响应式布局和移动设备优先的...
在OA后台管理中，这使得添加、删除或修改界面元素变得简单易行，提高了开发效率。 2. **事件处理**：jQuery的事件处理机制允许开发者轻松绑定多种事件，例如`click()`, `mouseover()`, `mouseout()`等。在OA系统中...
标题中的“jquery单行文字循环滚动”指的是使用jQuery库实现的一种常见的前端文本动画效果，它能使一行文字在页面上连续不断地循环滚动，常用于显示新闻标题、滚动公告等。jQuery是一个广泛使用的JavaScript库，它...
在网页设计中，弹出提示通常用于显示警告、确认信息或者简单的信息提示。本主题将详细介绍28种不同的HTML弹出提示代码，以及如何通过jQuery增强其功能。 1. **纯HTML弹出提示**：最基础的弹出提示是使用`<alert>`...
jQuery遮罩弹窗幻灯片特效是一个常用的网页交互功能，广泛应用于网站的公告、广告展示、用户提示等场景。这个特效结合了jQuery库的高效处理能力、CSS样式控制的灵活性以及JavaScript的动态效果，为用户提供了一种...
在"基于Animate.css的炫酷jQuery消息通知框插件"中，我们看到这个项目是将Animate.css与jQuery相结合，以创建一种独特且吸引人的通知提示框。jQuery是一种强大的JavaScript库，它简化了DOM操作、事件处理、动画和...
jQuery弹窗插件Modal.js是一款广泛应用于网页中的轻量级交互元素，主要用于显示重要的公告信息或者用户须知，提供了一种高效且易于定制的方式来实现页面内的弹窗提示。这款插件基于JavaScript库jQuery构建，因此它...
2. **浮动提示框**：可能是一个基础的提示框设计，展示简单的文本信息，可能包括不同样式（如背景色、边框、阴影等）以适应不同的页面设计。 3. **浮动提示1**：可能更注重提示内容的布局和格式，比如包含图像、链接...
**jQuery公告插件详解** 在Web开发中，与用户交互并提供反馈是至关重要的。jQuery作为一款强大的JavaScript库，提供了丰富的API和插件来简化这一过程。"jQuery-notice"是一个专门为jQuery设计的优秀“通知”插件，...
### jQuery单行文字向上滚动效果知识点 #### 1. jQuery简介 jQuery是一个快速、小巧、功能丰富的JavaScript库。它通过封装DOM操作、事件处理、动画...这种效果可以用于新闻滚动条、公告显示、以及信息提示等多种场景。
- **焦点提示**：当用户滚动到某个重要信息或公告时，可以突出显示或播放提示动画，吸引用户注意。 - **动态效果**：根据元素的可视状态，创建动态过渡效果，如渐入渐出、透明度变化等。 总之，jQuery ScrollWatch...
总结一下，这个示例展示了如何使用jQuery结合ExtJS实现一个简单的用户交互功能，即在用户尝试删除公告之前弹出确认对话框。这种方法可以防止用户意外触发删除操作，并且增加了用户体验。在实际开发中，这种模式常...
5. **数据管理**：可能通过简单的后台管理系统，让非技术人员也能更新公告内容。 6. **用户体验设计**：界面布局和色彩搭配注重用户体验，确保用户能够迅速理解和使用公告发布系统。 为了充分利用这个模板，企业...
然后判断是否已经显示完所有公告，如果是，则弹出提示；否则，更新当前显示的公告索引，更新页面上的消息计数，并将新的公告文本赋值给 `Text`。 这个例子展示了如何使用JavaScript的数组和定时器来创建一个动态...
在本文中，我们将深入探讨如何利用`jQuery`实现右下角弹出消息框，以提供各种公告或通知，提升用户体验。 首先，让我们理解消息框（Message Box）的概念。消息框是一种图形用户界面元素，用于向用户显示简短的信息...
在网页设计中，有时我们需要创建一个滚动消息框来展示网站公告、最新动态或者重要提示。这个"简单原生js文字向上滚动消息框代码"提供了一种实现方式，它不依赖于任何JavaScript库如jQuery，而是完全基于原生...
在网页设计中，跑马灯效果是一种常见的动态展示方式，常用于新闻滚动、公告提示或者活动展示等场景。跑马灯能吸引用户的注意力并高效地传递信息。在本例中，我们将探讨如何使用jQuery实现一个文字向上跑动的跑马灯...
2、新闻公告； 3、幻版片 4、友情链接 注：由于部分模板未调用，所以在后台也无须进行设置。 系统特点： 1、采用目前流行的PHP语言编写，底层采用超轻量级框架作为系统支撑； 2、页面布局使用DIV CSS技术，...
"简单的手机移动端新闻公告列表页面模板.html"可能采用了SEO最佳实践，提高内容的可发现性。 这些模版为开发者提供了丰富的参考资料，无论是初学者还是经验丰富的设计师，都能从中汲取灵感，快速构建出高质量的手机...