<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>xj</title>
<style>
body, div, ul, ol, li {
margin: 0;
padding: 0;
}
ol, ul {
list-style:none;
}
a {
text-decoration:none;
}
.wrap {
background: url(http://pal6images.roogames.com/xianjian6x/images/big.jpg) no-repeat center top;
width: 100%;
height: 332px;
}
.wrap-bg {
width: 1000px;
height: 330px;
margin: 0 auto;
position: relative;
}
.wrap-btns {
height: 171px;
width: 980px;
padding: 10px;
position: absolute;
z-index: 2;
}
.wrap-btns li {
float: left;
width: 80px;
height: 181px;
}
#rightSpace {
margin-right: 500px;
}
.wrap-btns li a {
display: inline-block;
background: url(http://pal6images.roogames.com/xianjian6x/images/figure.png) no-repeat;
width: 100%;
height: 100%;
}
.show-bg {
width: 1000px;
height: 330px;
position: absolute;
top: 0;
z-index: 1;
}
.click_out .pic1 { background-position: -2px -3px;}
.click_out .pic2 { background-position: -81px -3px;}
.click_out .pic3 { background-position: -160px -3px;}
.click_out .pic4 { background-position: -239px -3px;}
.click_out .pic5 { background-position: -318px -3px;}
.click_out .pic6 { background-position: -397px -3px;}
.pic1:hover { background-position: -2px -199px;}
.pic2:hover { background-position: -81px -199px;}
.pic3:hover { background-position: -160px -199px;}
.pic4:hover { background-position: -239px -199px;}
.pic5:hover { background-position: -319px -199px;}
.pic6:hover { background-position: -397px -199px;}
.click_in .pic1 { background-position: -2px -199px;}
.click_in .pic2 { background-position: -81px -199px;}
.click_in .pic3 { background-position: -160px -199px;}
.click_in .pic4 { background-position: -239px -199px;}
.click_in .pic5 { background-position: -319px -199px;}
.click_in .pic6 { background-position: -397px -199px;}
</style>
</head>
<body>
<div class="wrap">
<div class="wrap-bg">
<ul class="wrap-btns">
<li class="click_in"><a href="javascript:void(0)" class="pic1"></a></li>
<li class="click_out"><a href="javascript:void(0)" class="pic2"></a></li>
<li id="rightSpace" class="click_out">
<a href="javascript:void(0)" class="pic3"></a>
</li>
<li class="click_out"><a href="javascript:void(0)" class="pic4"></a></li>
<li class="click_out"><a href="javascript:void(0)" class="pic5"></a></li>
<li class="click_out"><a href="javascript:void(0)" class="pic6"></a></li>
</ul>
<div class="show-bg" style="background:url(http://pal6images.roogames.com/xianjian6x/images/big1.jpg) no-repeat"></div>
</div>
</div>
</body>
</html>
<script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(function() {
var _btnIndex = 0;
var timer = null;
$('.wrap-btns li').click(function() {
var _this = $(this);
clickIn(_this);
});
function clickIn(_this) {
if (_btnIndex == _this.index())
return;
_btnIndex = _this.index();
_this
.attr('class', 'click_in')
.siblings().attr('class', 'click_out');
$('.show-bg')
.css('display', 'none')
.css('background', 'url(http://pal6images.roogames.com/xianjian6x/images/big' + (_btnIndex + 1) + '.jpg) no-repeat')
.stop(true, true)
.fadeIn(300);
}
timer = setInterval(autoPlay, 3000);
$('.wrap').hover(function() {
clearInterval(timer);
}, function() {
timer = setInterval(autoPlay, 3000);
});
function autoPlay() {
_btnIndex < $('.wrap-btns li').length - 1 ? _btnIndex++ : _btnIndex = 0;
$('.wrap-btns li')
.eq(_btnIndex).attr('class', 'click_in')
.siblings().attr('class', 'click_out');
$('.show-bg')
.css('display', 'none')
.css('background', 'url(http://pal6images.roogames.com/xianjian6x/images/big' + (_btnIndex + 1) + '.jpg) no-repeat')
.fadeIn(300);
}
})
</script>
timelessmemory
- 浏览: 4577 次
- 性别:
- 来自: 常州
-
相关推荐
3. 在打开的“鼠标属性”窗口中，切换到“指针”选项卡。在这里，你可以看到系统提供的各种鼠标指针样式。 4. 要应用新的“仙剑奇侠传四”指针，点击“浏览”按钮，找到你之前解压的"Cursors"文件夹，选择其中的....
《仙剑奇侠传1》是中国游戏史上的一款经典之作，其源码的公开为游戏开发者提供了宝贵的参考资料。这款基于纯C语言编写的程序，展现了早期游戏开发的技术与设计理念。源码的可运行性使得我们有机会深入理解游戏的内部...
《Java仙剑奇侠传源代码》是一款基于Java J2ME平台开发的手机游戏，它再现了经典单机游戏《仙剑奇侠传》的世界观和游戏机制。J2ME，全称为Java Micro Edition，是Java平台的一个子集，主要用于嵌入式设备和移动设备...
手机JAR游戏 仙剑奇侠传 可以手机玩 也可以用手机JAR模拟器玩 仙剑1的PC移植版 移植程度大于95％，超级经典！！！
根据提供的文件信息，“仙剑手游完整的源代码”这一标题及描述“仙剑手游源码”，主要涉及的是关于《仙剑》这款知名国产游戏的手游版本的源代码分享。接下来将从多个方面对这一主题进行详细解析，包括但不限于《仙剑...
2. 标题标签：在内，元素用来设置浏览器标签页上的标题，对于这个仙剑网站，可能是“仙剑奇侠传 - 网站”之类的标题。 3. 文本内容：在中，制作者可能使用了到（标题）、（段落）、（强调）、（加粗）等标签来组织...
《Java仙剑奇侠传游戏》是一款基于Java编程语言开发的简易版电子游戏，它将中国传统文化中的经典武侠故事——《仙剑奇侠传》融入到编程世界中，为玩家提供了一种独特的交互体验。这款游戏中包含了丰富的图像资源，...
"rix 仙剑音乐播放器"是一款基于DOS时代的经典游戏《仙剑奇侠传》设计的音乐播放软件，主要用于播放游戏中使用的rix格式的音乐文件。rix格式是专门为《仙剑奇侠传》游戏定制的一种音频格式，它包含了游戏中的背景...
六、未来发展趋势 随着HTML5技术的不断进步，更多高品质的HTML5游戏将涌现出来，且随着5G网络的普及，网络延迟问题将得到改善，HTML5游戏的体验将更加流畅。《仙剑奇侠传》的HTML5版本是这一趋势的一个实例，它预示...
《98仙剑奇侠传源码解析与技术探讨》 在游戏开发的历史长河中，98版的《仙剑奇侠传》无疑是中国PC游戏的经典之作，它以其动人的剧情、细腻的人物描绘和独特的游戏机制，赢得了无数玩家的喜爱。如今，这款作品的源码...
《另类仙剑》是一款基于游戏编程类的资源，它包含了一个名为"另类仙剑.exe"的可执行文件。这个程序可能是一个独立的游戏或游戏模组，利用了控件技术来提供玩家交互体验。在IT领域，游戏编程类的项目通常涉及到多个...
《仿仙剑 DX RPG》是一款基于经典角色扮演游戏《仙剑奇侠传》的复刻或致敬作品，使用了DX技术进行开发，旨在为玩家提供一个类似原版游戏体验的同时，利用现代技术提升画质和游戏性能。这个项目对于那些想要学习游戏...
Unity3D是一款跨平台的游戏开发工具，它支持多种编程语言（如C#、JavaScript等），并且能够发布到多个平台上，包括Windows、Mac、Linux、Android、iOS等。由于其易用性及强大的功能，Unity3D已经成为游戏开发者们的...
《新仙剑奇侠传》是一款基于Unity3D引擎开发的知名角色扮演游戏，其源码提供了深入理解游戏开发过程和Unity3D引擎功能的宝贵机会。以下是对源码中的关键知识点进行的详细解读： 1. **Unity3D引擎**：Unity3D是一个...
《仙剑奇侠传》是一款深受玩家喜爱的经典角色扮演游戏，其95版本更是许多人的童年回忆。本压缩包“仙剑地图人物修改工具.rar”提供了一款基于.NET框架的工具，旨在帮助玩家和游戏开发者对游戏的人物、地图及对话内容...
已经绝版的仙剑DOS编辑器，压缩包内还有一些其他相关的资料。文件列表： MapEditor，MKF文件工具，PalTools.NET，RGM文件工具，FBP文件.txt，M文件.txt，SSS文件.txt，场景号.txt，存档文件A.txt，存档文件B.txt，...
《J2ME版仙剑奇侠传》是一款基于Java 2 Micro Edition (J2ME) 平台开发的手机游戏，它将经典的仙剑奇侠传故事带到了移动设备上，让玩家能够在小巧的屏幕上体验到传统角色扮演游戏(RPG)的乐趣。这款游戏在设计时充分...
《仙剑奇侠传》是一款深受玩家喜爱的经典角色扮演游戏，其在IT领域的独特之处在于它是由Java编程语言实现的。Java是一种广泛应用于网络、移动应用、服务器端开发的强大且跨平台的语言，因其“一次编写，到处运行”的...
《95仙剑奇侠传》是中国游戏史上的一款经典之作，由大宇资讯的DOMO小组于1995年研发推出。这款游戏以其独特的故事情节、细腻的人物描绘和动人的音乐深受玩家喜爱，至今仍有着广泛的影响力。源代码是程序开发的核心，...
《安卓平台上的“仙剑壁纸”应用详解及使用指南》 在智能手机日益普及的今天，个性化手机界面成为了许多用户表达自我、展现个性的方式之一。尤其是对于游戏爱好者来说，使用自己喜欢的游戏主题壁纸无疑能让手机更具...