JS实现动态图片新闻

JavaScript实现网站首页动态效果 使用JS做一个首页,主要效果有轮播,遮罩弹框,广告栏定时消失,消息自动循环播放等。 广告栏设置10s定时消失,主要思路是修改其上边距,设置一个定时器,1s运行一次,10s后将其上移到屏幕外并移除 主要js代码: var adTop = document.getElementById('advTop'); var adTopEm = adTop.getElementsByTagName... 阅读详情

动态图片新闻,JS实现.


<script language="JavaScript">
var imgUrl=new Array();
var imgLink=new Array();
var imgText=new Array();
var picNum=0;
imgUrl[1]="图片地址一";
imgLink[1]="链接1";
imgText[1]="标题或简介或其它HTML内容1";
imgUrl[2]="图片地址二";
imgLink[2]="链接2";
imgText[2]="标题或简介或其它HTML内容2";
imgUrl[3]="图片地址三";
imgLink[3]="链接3";
imgText[3]="标题或简介或其它HTML内容3";
imgUrl[4]="图片地址四";
imgLink[4]="链接4";
imgText[4]="标题或简介或其它HTML内容4";
imgUrl[5]="图片地址五";
imgLink[5]="链接5";
imgText[5]="标题或简介或其它HTML内容5";


function NextPic(){
    if(picNum<4) picNum++ ;//显示4个图片
    else picNum=1;
    if (document.all){
        //下面注意,如果存在于FORM表单中,需要使用下面的方法,否则可直接使用name。
        document.imgInit.filters.revealTrans.Transition=Math.floor(Math.random()*23);
        document.imgInit.filters.revealTrans.apply();
        document.imgInit.filters.revealTrans.play();
    }
    document.images.imgInit.src=imgUrl[picNum];
    //如果不是图片,而是SWF等,可做判断,内容可在程序中做好,再放于下面。
    focustext.innerHTML='<a href='+imgLink[picNum]+' target=_blank>'+imgText[picNum]+'</a>';
    //设置翻页时间
    theTimer=setTimeout('NextPic()', 3000);
}


function goUrl(){
    window.open(imgLink[picNum],'_blank');
}
</script>


HTML代码中:
可以做到控件中
<TABLE cellPadding=0 width=100% border=0>
        <TR>
          <TD align=middle height="140" >
<div align='center'>
<a href='javascript:goUrl()'><img style="FILTER: revealTrans(duration=2,Transition=5)" src="javascript:NextPic()" width="170" height="120" border="1"  id=imgInit name=imgInit></a></TD></TR>
<TR><TD align=middle height="38" ><div name=focustext id=focustext align='center'></div>
</div>
</TD></TR></TABLE>

网页特效代码-新闻图片切换特效 (转)新闻切换特效:http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">新闻切换技术body { text-align: center; margin:0; padding:0; background: #FFF; font-size:12px; color:#000;}d 阅读详情

相关推荐

网易新闻详情页排版实现思路

不论是哪一家新闻app的新闻详情页都有大量的图片和片断性的文字,一直很好奇它排版的具体实现方式,构想过一些办法(富文本之类)发现都不是明智的方法,所以决定研究一下。

warm的博客 1万+

新闻图片切换代码(纯js,no flash)

#imgTitle {FILTER: ALPHA(opacity=70); LEFT: 0px; OVERFLOW: hidden; POSITION: relative; TEXT-ALIGN: left}#imgTitle_up {LEFT: 0px; HEIGHT: 1px; TEXT-ALIGN: left}#imgTitle_down {LEFT: 0px; TEXT-ALIGN:lef

zjq118的专栏 8254

使用JSP+Access+js实现图片新闻发布系统及前台动态显示

用jsp+Access+js做了一套简单的图片新闻发布系统,这次这个是第一个版本,只实现了基本的功能(新闻发布、前台图片动态显示(使用滤镜))。其它数据源名称为inps 后台管理员用户密码:admin/admin 全部是使用jsp页面实现的,没有使用servlet.其中图片上传组件使用SmartUpload实现的。希望大家多提宝贵意见!

基于原生js实现今日新闻网站

该网站设计大部分都是基于原生js实现。基本思想为首先将基本的页面架构包括header,导航条写好。之后根据后台PHP请求接口请求返回JSON格式数据后,对获得的数据进行整理渲染结构化。根据获取到的每条新闻的数据不同渲染出不同的页面样式添加到容器里面即可。...

毕业作品网站 1179

DINOv3实战指南:如何利用零样本视觉模型革新工业质检

本文详细介绍了如何利用DINOv3零样本视觉模型革新工业质检流程。通过无需标注数据的自监督学习技术,DINOv3能快速部署高精度检测系统,显著降低成本和提升效率。文章涵盖模型选型、数据准备、实时检测优化及典型行业解决方案,为工业质检提供革命性AI实践指南。

ansible6ops的博客 124

STM32单片机语音提示盲人拐杖整点报时夜间警示超声波测距

STM32单片机语音提示盲人拐杖整点报时夜间警示超声波测距 关键词:语音提示盲人拐杖 整点报时 超声波测距拐杖

LS840233684的博客 2047

首页JS新闻代码

JS分类调用说明: 1,一级分类调用: <script language="javascript" src="owen.asp?owen1=国内新闻&n=6"> 表示调用一级分类中的 国内新闻 6条 2,二级分类调用: <script language="javascript" src="owen.asp?owen1=国内新闻&owen2=本地新闻&n=8"> 表示调用 国内新闻 下的二级分类

php菜鸟技术天地 947

汽车氛围灯 PCBA 方案开发:从技术底层解析车载光效的核心逻辑

摘要: 车载氛围灯PCBA方案开发需兼顾性能与车规要求。主控芯片选型应关注运算能力、温度适应性和低功耗(如NXPS32K344、复旦微FM33FG065A)。电路防护需采用TVS二极管等组合设计,满足ISO7637-2浪涌防护标准。通信协议分层应用(CAN+LIN),调光需解决色准与温漂问题,动态灯效通过FIFO队列实现。开发中需进行温度循环、振动、EMC等可靠性测试,细节处理(如三防涂覆)至关重要。该领域开发需熟悉车规标准并积累实车经验。

2401_87454052的博客 1132

使用js原生代码实现类似新闻列表的滚动 题目来自4399小游戏2020年前端笔试编程题

新闻列表的滚动循环播放html代码CSS代码Script代码总结 题目要求: 要求实现以下页面,其中列表项是滚动循环播放的,而且每次只显示3个,当鼠标经过的时候停止播放,鼠标离开继续播放 const NOTICE_LIST = [ '恭喜罗X获得特等奖 别墅一套', '恭喜张4获得一等奖 跑车一辆', '恭喜张5获得二等奖 华为手机一部', '恭喜张6获得二等奖 华为手机一部', '恭喜张7获得三等奖 小米手机一部', '恭喜张8获得三

canoe777的博客 642

三模冗余设计

在数字电路设计中,Voter模块(表决器) 和 三模冗余(Triple Modular Redundancy, TMR) 是高可靠性系统的核心设计技术,主要用于容错和抗辐射(如航天、医疗设备等关键领域)。容错机制:若任一模块故障(如SEU,单粒子翻转),其他两个模块仍能保证正确输出。功耗与面积:TMR会显著增加资源占用(约3倍),需权衡可靠性和成本。航天电子:抗辐射芯片(如FPGA)中用于防止单粒子翻转(SEU)。故障检测:可扩展设计以检测并隔离故障模块(如通过BIST)。

qq_45776815的博客 2055

【2025软考高级架构师】基础知识部分——6、软件架构设计

(1)架构是对系统的抽象(2)架构由多个结构组成(3)任何软件都存在架构(4)元素及其行为的集合构成架构的内容(5)架构具有“基础”性(6)架构隐含有“决策”

qq837993702的博客 1万+

JavaScript案例-轮播图

第二步:创建JavaScript脚本,先获取图片的节点(getElementById、getElementByClassName)。屏幕录制 2024-11-11 093734。

2302_80916083的博客 648

高通平台N4单路输入的720P相机预览

N4的一路720P Camera作为MIPI摄像头使用

llw21680的专栏 165

html个人新闻网站,html,js,css实现

仿新闻网站,一个页面,五个部分,一共一个页面,每个标题都可以通过a标签切换到对应的网站。

m0_72190449的博客 6459

2020.12.25丨CRISPResso2安装教程

一个月前接到一个项目,说是做关于CRISPR的编辑效率个性化分析。本来这个分析以前是没有做过的,不过客户发了参考文献。里面流程和命令行都非常清楚,再加上读研期间CRISPR的项目“中道崩殂”,让我对CRiSPR的技术有些执念,便下决心接下来试试。 整个测序分析使用的工具就是CRISPResso,,下面介绍最快捷的安装方式。 首先,CRISPResso只支持python2.X,不支持3.X你需要下载Anaconda或者miniconda,以Miniconda为例: 安装环境: Linux 64-bi

4634

二极管钳位电路、限幅电路和检波电路Multisim电路仿真

本文系统介绍了二极管钳位、限幅和检波三种基础电路的工作原理及Multisim仿真验证。钳位电路通过电容-二极管配合实现波形整体平移,将波峰或波谷固定在指定电压;限幅电路利用二极管导通特性削除信号超出设定阈值的部分;检波电路则通过半波整流和电容滤波从调幅波中提取音频信号。三种电路均通过Multisim仿真验证了理论分析结果,展示了二极管在信号处理中的关键作用。这些基础电路广泛应用于信号调理、电平保护和通信解调等领域。

XU157303764的博客 1124

CSS_新闻版块_常用新闻版块1

描述: 门户网站常见的那种新闻版块,根据不同的标题显示不同的信息内容效果图: HTML: 常见问题 业界动态

trace的技术备忘专栏 2064

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

vue.js循环加载图片资源,可从后台获取图片资源

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...

kangqiang1998的博客 1204

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

图片新闻的无限滚动

  上个星期开始接触JavaScript,看了JavaScript说明,感觉挺灵活的,缺点是调试太麻烦了,我昨天晚上下载了Editplus来写脚本还可以。   下面是昨天晚上写的图片新闻的无限滚动,网络上的都是定义好了具体的图像个数,而我的这个稍加改动就可以不限制图像,后面再丰富它。  今天看了一些网页游戏,准备学习一下练手。&lt;html&gt;&lt;head&gt;&lt;title&gt...

weixin_34059951的博客 89

最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版

Part-E1-SDIO-Specification-Ver4.00-Final-120220.pdf:最新的sdio 4.0 spec 协议标准 带书签 高清完整PDF版,包括SDIO 接口的外设,SDIO 接口官方协议等。

Flash 新闻效果(js实现)

js实现 Flash 新闻效果: imgUrl1="http://www.fansart.com/qiehuan/1.jpg";imgtext1="page 1"imgLink1=escape("http://www.lymi.cn/");imgUrl2="http://www.fansart.com/qiehuan/2.jpg";imgtext2="page 2"imgLink2=escap

刘浪web技术博客 555

自己写的一个图片循环显示的代码

Result: code:<!--var imgIndx = 1;var imgCounts = ${fn:length(newsList)} ;//图片总数var imgStr = ;$(document).ready(function(){ imgStr += + " alt="Log

1454

乐库网页播放器与动态切换图片新闻

乐库网页播放器: var miniplayer_userid = 1317593267; var miniplayer_ad_sound = false; var miniplayer_ad_url = ""; var miniplayer_position = "right"; var miniplayer_load_official_album = false; http://ent.s

******ASP.net探究****** 819

新闻切换选项卡效果

新闻切换技术 body { text-align: center; margin:0; padding:0; background: #FFF; font-size:12px; color:#000;} div,form,img,ul,ol,li,dl,dt,dd {margin: 0; padding: 0; border: 0;} h1,h2,h3,h4,h5,h6 { margin

qiaoyuetian博客访谈 744

新闻动态切换图片html(flash)

效果图: 代码: <table id="table_zi"> <tr> <td class="width330"> <!--新闻图片交替开始--> ...

王洪洪的博客 149

偷师学艺之截取鲜果网的图片新闻幻灯效果

偶然之间发现鲜果网(http://www.xianguo.com), 第一眼就被其首页上的图片新闻幻灯效果所深深吸引。于是决定偷师学艺,截取下来为我所用。   第一步,查看网页源文件,取我所需 用IE进入到鲜果网后,直接右键查看源文件,将其整个拷贝出来慢慢研究。 打开源文件后,看到其内容很清爽,看上去感觉代码很规范,于是想到了去W3C(http://jigsaw.w3.org/css-va

seapen的专栏 1722

asp.net中使用jquery实现动态加载新闻框

asp.net使用jquery动态加载新闻图片框

Be what you wanna be 1475
上一篇: 马士兵struts笔记
下一篇: JSP跳转方式与Servlet跳转方式的区别
chenndd
博客等级 码龄17年 13粉丝 12原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值