
组织办活动,到了抽题答题的环节我想用这么一个转盘选题,总比拿箱子放纸条要高端大气多了
找个差不多的自己改一下P点图片就OK了其实,有什么更好的方案么
第一种是JS+HTML的:
[mw_shl_code=javascript,true]<!DOCTYPE HTML>
*本站禁止HTML标签噢*
*本站禁止HTML标签噢*
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
*本站禁止HTML标签噢* flash抽奖转盘通用模板</title>
<style type="text/css">
#flashContent { width:510px; height:510px; }
#layer { background:#f5f5f5; border:#000 solid 1px; padding:20px; position:absolute; left:50%; top:50%; display:none; }
</style>
</head>
*本站禁止HTML标签噢*
<div id="flashContent"></div>
*本站禁止HTML标签噢*
flashHoler = "flashContent" //加载flash的容器ID
autoPlay = "yes" //初始化时是否自动旋转,"yes" or "no"
setPointer="no" //初始化时是否设置鼠标指针,"yes" or "no"
url_bg = "bg.png"; //转盘背景图片
url_prize = "prize.png"; //奖品图片
url_pointer = "pointer.png"; //指针图片
url_btnStart = "btnStart.swf"; //开始按钮图片,可以是图片或flash
url_btnOver = "btnOver.gif"; //鼠标经过图片
url_btnWait = "btnWait.gif"; //旋转过程中按钮图片
url_btnSuc = "btnSuc.gif"; //旋转结束后按钮图片
W_bg = "510"; //背景图片尺寸
W_btn = "124"; //按钮图片尺寸
W_pointer = "150"; //指针图片宽度
H_pointer = "255"; //指针图片高度
totleNum = 10; //奖品个数
turns = 10; //旋转圈数
stopNum = Math.floor(Math.random()*10)+1; //中奖奖品
</script>
<script src="loadFlash.js"></script>
<script src="jquery-1.7.min.js"></script>
</body>
</html>[/mw_shl_code]
上面中奖奖品的地方是我自己改了个随机数,附件里面的demo3.html是这个
第二种是HTML5的:
图片看起来很渣对吧,页面没有用图片,就一个HTML,这个圈全是canvas里面画出来的,转的很平稳,最后还是慢慢停下的
[mw_shl_code=javascript,true]<input type="button" value="开始旋转" style="float: left;" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<canvas id="wheelcanvas" width="500" height="500"></canvas>
<script type="application/javascript">
var colors = ["#B8D430", "#3AB745", "#029990", "#3501CB",
"#2E2C75", "#673A7E", "#CC0071", "#F80120",
"#F35B20", "#FB9A00", "#FFCC00", "#FEF200"];
var restaraunts = ["北京", "上海", "天津", "南京",
"杭州", "深圳", "武汉", "济南",
"重庆", "大连", "合肥", "郑洲"];
var startAngle = 0;
var arc = Math.PI / 6;
var spinTimeout = null;
var spinArcStart = 10;
var spinTime = 0;
var spinTimeTotal = 0;
var ctx;
function draw() {
drawRouletteWheel();
}
function drawRouletteWheel() {
var canvas = document.getElementById("wheelcanvas");
if (canvas.getContext) {
var outsideRadius = 200;
var textRadius = 160;
var insideRadius = 125;
ctx = canvas.getContext("2d");
ctx.clearRect(0,0,500,500);
ctx.strokeStyle = "black";
ctx.lineWidth = 2;
ctx.font = 'bold 12px sans-serif';
for(var i = 0; i < 12; i++) {
var angle = startAngle + i * arc;
ctx.fillStyle = colors;
ctx.beginPath();
ctx.arc(250, 250, outsideRadius, angle, angle + arc, false);
ctx.arc(250, 250, insideRadius, angle + arc, angle, true);
ctx.stroke();
ctx.fill();
ctx.save();
ctx.shadowOffsetX = -1;
ctx.shadowOffsetY = -1;
ctx.shadowBlur = 0;
ctx.shadowColor = "rgb(220,220,220)";
ctx.fillStyle = "black";
ctx.translate(250 + Math.cos(angle + arc / 2) * textRadius, 250 + Math.sin(angle + arc / 2) * textRadius);
ctx.rotate(angle + arc / 2 + Math.PI / 2);
var text = restaraunts;
ctx.fillText(text, -ctx.measureText(text).width / 2, 0);
ctx.restore();
}
//Arrow
ctx.fillStyle = "black";
ctx.beginPath();
ctx.moveTo(250 - 4, 250 - (outsideRadius + 5));
ctx.lineTo(250 + 4, 250 - (outsideRadius + 5));
ctx.lineTo(250 + 4, 250 - (outsideRadius - 5));
ctx.lineTo(250 + 9, 250 - (outsideRadius - 5));
ctx.lineTo(250 + 0, 250 - (outsideRadius - 13));
ctx.lineTo(250 - 9, 250 - (outsideRadius - 5));
ctx.lineTo(250 - 4, 250 - (outsideRadius - 5));
ctx.lineTo(250 - 4, 250 - (outsideRadius + 5));
ctx.fill();
}
}
function spin() {
spinAngleStart = Math.random() * 10 + 10;
spinTime = 0;
spinTimeTotal = Math.random() * 3 + 4 * 1000;
rotateWheel();
}
function rotateWheel() {
spinTime += 30;
if(spinTime >= spinTimeTotal) {
stopRotateWheel();
return;
}
var spinAngle = spinAngleStart - easeOut(spinTime, 0, spinAngleStart, spinTimeTotal);
startAngle += (spinAngle * Math.PI / 180);
drawRouletteWheel();
spinTimeout = setTimeout('rotateWheel()', 30);
}
function stopRotateWheel() {
clearTimeout(spinTimeout);
var degrees = startAngle * 180 / Math.PI + 90;
var arcd = arc * 180 / Math.PI;
var index = Math.floor((360 - degrees % 360) / arcd);
ctx.save();
ctx.font = 'bold 30px sans-serif';
var text = restaraunts[index]
ctx.fillText(text, 250 - ctx.measureText(text).width / 2, 250 + 10);
ctx.restore();
}
function easeOut(t, b, c, d) {
var ts = (t/=d)*t;
var tc = ts*t;
return b+c*(tc + -3*ts + 3*t);
}
draw();
</script>[/mw_shl_code]
[查看全文]
之前写博客 在文章插入MP3都是在搜狗音乐找的外链
缺点:
1.外链不稳定 经常改mp3链接
2.你妹的盗链啊
3.毕竟不是我的链
……
这期来讲下 怎么利用百度网盘音乐来做mp3直链
[mw_shl_code=php,false] <?php
//匹配shareid和uk参数
preg_match('|\/(\d*)\/(\d*)\.|', $_SERVER["REQUEST_URI"], $res);
list($shareid, $uk) = array_slice($res, 1, 2);
if ($uk != "3240220216") {
exit(0);
}
//构造百度网盘分享网址获取源码
$url = "http://pan.baidu.com/share/link?shareid=$shareid&uk=$uk";
$src = file_get_contents($url);
//匹配源码里面的音乐地址并跳转
preg_match('|MusicPlayer\("(.*)"|U', $src, $res);
$songurl = $res[1];
//如果要外链其它格式的文件,可以反注释下面两行代码
preg_match('|dlink\\\":\\\"(.*)\\\"|U', $src, $res);
$songurl = str_replace("\\\\", "", $res[1]);
header("Location:$songurl");[/mw_shl_code]
另存为baidu.php 放到网站目录
防盗链:修改函数中uk值3240220216为你自己的
例如我的是http://pan.baidu.com/share/home?uk=3240220216
在.htaccess添加
[mw_shl_code=php,false] RewriteEngine on
RewriteRule ^bd bd.php [L][/mw_shl_code]
将以下函数复制另存为baidu.html(名字随意)
[mw_shl_code=php,false] <!DOCTYPE HTML>
<html lang="en">
*本站禁止HTML标签噢*
<meta charset="UTF-8">
*本站禁止HTML标签噢* </title>
</head>
<script type="text/javascript">
function Change()
{
var url = document.getElementById("text1").value;
var arr = url.split("&");
var shareid = arr[0].split("=")[1];
var uk = arr[1].split("=")[1];
var songurl = "http://你的网站/baidu/"+shareid+"/"+uk+".mp3"; //地址跳转了 这边就不用写baidu.php了
document.getElementById("text2").value = songurl;
}
</script>
*本站禁止HTML标签噢*
分享地址:<input id="text1" type="TEXT" value="" size="100"/><br />
外链地址:<input id="text2" type="TEXT" value="" size="100"/><br />
<input type="BUTTON" value="转换" onclick="Change()"/>
</body>
</html>[/mw_shl_code]
运行baidu.html 输入分享链接
例如:http://pan.baidu.com/share/link?shareid=3496067596&uk=3240220216
经过转换后:http://www.iippcc.com/bd/3496067596/3240220216.mp3
[查看全文]
本帖最后由 蓝宇轩 于 2012-8-11 15:11 编辑
[mw_shl_code=xhtml,true]<!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">
*本站禁止HTML标签噢*
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
*本站禁止HTML标签噢* 时间</title>
<style type="text/css">
body{ background:#CCC;}
#mydiv{height:35px;}
</style>
</head>
*本站禁止HTML标签噢*
<div id="mydiv"></div>
</body>
</html>
<script type="text/javascript">
function $$(id){
return document.getElementById(id);//用它来寻找到指定id的div;
}
function datetime(){
var dt=new Date();//定义一个日期对象;
var dttime=dt.getFullYear()+"-";//将时期对象的"年"填充到dttime里;用"-"字符串分开;
dttime+=dt.getMonth()+1+"-";//将时期对象的"月"填充到dttime里;
dttime+=dt.getDate()+"-";//将时期对象的"日"填充到dttime里;
dttime+=dt.getHours()+"-";//将时期对象的"小时"填充到dttime里;
dttime+=dt.getMinutes()+"-";//将时期对象的"分"填充到dttime里;
dttime+=dt.getSeconds();//将时期对象的"秒"填充到dttime里;
$$("mydiv").innerHTML=dttime;//将dttime填充到Div(mydiv)的内容里;
setTimeout("datetime()",1000);//每隔1000毫秒(1秒)执行一次上面的函数;时间就在逐渐更新了;
}
window.onload=datetime;//窗体打开就执行;
</script>[/mw_shl_code]
[查看全文]
本帖最后由 蓝宇轩 于 2012-8-11 02:11 编辑
用html5;可以不用flash来当网页播放器了!
那就是video标签和audio标签
[mw_shl_code=html,true]<!doctype html>
*本站禁止HTML标签噢*
*本站禁止HTML标签噢*
<meta charset="utf-8">
*本站禁止HTML标签噢* 无标题文档</title>
</head>
*本站禁止HTML标签噢*
<video controls>
<source src="file:///D|/动漫/动漫/东方/幻想万华镜-春雪异变之章配音版(蓝光).MP4" type="video/mp4"/>
</video>
<audio controls>
<source src="file:///D|/动漫/动漫歌曲/旧番/【Clannad】eufonius - メグメル.mp3"/>
</audio>
</body>
</html>
[/mw_shl_code]
html5的声明已经和xhtml1和html4不一样了很简洁;只有一句:<!doctype html>来声明.
上面是视频;下面是音频;地址自己改!
目前wmv格式视频谷歌与IE浏览器支持;火狐不支持;
controls这个属性尽量不去掉,否则播放按钮的工具栏会隐藏起来
[查看全文]
显然还有很多人在用JavaScript而非Jquery等框架,而且JavaScript还有有很多无法替代的强大优点。
JavaScript没有trim()函数,想去除字符串的空格却找不到合适办法,这不,有人帮我们实现了(代码摘抄自网络来源已无从考证)!更加强大的去除左右边空格函数巨实用。
[mw_shl_code=javascript,true]//去除左边的空格
function Ltrim(){
document.getElementById("txt").value=(document.getElementById("txt").value).replace( /^\s*/,"");
}
//去除右边的空格
function Rtrim(){
document.getElementById("txt").value=(document.getElementById("txt").value).replace(/(\s*$)/g,"");
}
//去除左右两边的空格
function LRtrim(){
document.getElementById("txt").value=(document.getElementById("txt").value).replace(/^\s+|\s+$/g,"")
}
//去除所有的空格
function trim(){
document.getElementById("txt").value=(document.getElementById("txt").value).replace(/\s+/g,"");
}[/mw_shl_code]
[查看全文]
最近逛Y宝的X猫,猛然发现搜索框已经悄然变样了,变得更加的有趣和智能,搜索框里会自动显示热门的搜索词且每隔一段时候换一个,我觉得这样的好处是,既帮X猫自己做的广告推送又免去用户搜索的麻烦,可谓一举两得。而享受此搜索框带来的方便同时,我却在思考如何实现这样一个搜索框的问题了,正所谓:三句话不离老本行吧!:)当天我就抽空做了一个,时间和技术有限,纯属业余之作,大家全当看看做个参考吧。
JavaScript代码:
[mw_shl_code=javascript,true]var defval="SKII 入驻X猫";//默认显示的文本框内容
//文本框失去焦点的方法
function blurMd(){
if(val.length==0){
document.getElementById("txt").value=defval;
grayStyle();
}else if(val==defval){
grayStyle();
}
}
//点击文本框触发的方法
function clickMd(){
var val=document.getElementById("txt").value;
if(val==defval){
var a =document.getElementById("txt").createTextRange();
a.moveStart('character',0);
a.collapse(true);
a.select();
lgrayStyle();//改样式为浅灰色
}
}
//将文本框字体颜色设置为淡灰色
function lgrayStyle(){
document.getElementById("txt").style.color="lightgray";
}
//将文本框字体颜色设置为灰色
function grayStyle(){
document.getElementById("txt").style.color="gray";
}
//将文本框字体颜色设置为黑色
function blackStyle(){
document.getElementById("txt").style.color="black";
}
window.onload=function(){
document.getElementById("txt").value=defval;//初始化显示内容
clickMd();//移动光标到首位
grayStyle();//文本灰色样式
//文本框点击事件
document.getElementById("txt").onkeydown=function(){
var val=document.getElementById("txt").value;//获得当前文本框的内容
if(val==defval&&(event.keyCode==37||event.keyCode==39)){//如果输入的是左右键并且是默认内容,则不做处理
//return false;
this.blur();//失去焦点
}else{
blackStyle();//改为黑色样式
if(val==defval){//如果是默认内容则清空,并且样式改为灰色
document.getElementById("txt").value="";
}
}
}
//搜索按钮点击事件-应该是带入文本框内容到后台查询的,我这里只做一个取值的展示
document.getElementById("btn").onclick=function(){
alert("您即将搜索的内容是:"+document.getElementById("txt").value);//显示当前文本框的内容
}
}[/mw_shl_code]
HTML代码:
[mw_shl_code=html,true]<input type="text" id="txt" onblur="blurMd()" onkeydown="keydownMd()" onclick="clickMd()" /><input type="button" id="btn" value="搜索"/>[/mw_shl_code]
上面的代码插入相应标签内可直接运行(已亲测),可能存在一些小bug大家参考下吧!#6958!
[查看全文]





一开始先声明,明天开学#5x,所以本教程更新时间大概为一周一次。。
首先呢是对node.js的一些简介
也许你第一眼看到这个名字会觉得这是一个JavaScript的应用
但其实呢,Node.js是一个后端的Javascript运行环境,或者说是一个平台
这个环境采用V8引擎(如果对javascript有了解的童鞋应该知道,不过呢,不知道也没事,你只要知道好厉害好厉害的引擎就行了,也就是说这是一个好厉害好厉害的东西。。。)
目前为主要用来进行web项目的开发的后端语言。
怎么说呢,node.js与其他的后端语言(比如php)有一些不同
其他的语言一般是先要有一个HTTP服务器,比如Apache什么的
但是node.js不同哦,在Node中,Http是首要的,所有项目都是从创建一个服务器开始的。。这个后面会讲到。
本篇主要是作为以后的一个目录功能,然后是node.js的安装及hello world部分。
目前node.js是一门新但比较成熟,至少比dart还是会相对来说更被支持,国内的大多数服务器商家都会支持node.js语言。
下面我就来手把手教你在windows下安装node.js,并进行一个常规的hello world程序。。
(node.js的一些资源:cnode社区:http://cnodejs.org,入门教程:http://www.nodebeginner.org/index-zh-cn.html)
一:安装
首先前往node.js的官网:http://www.nodejs.org/
直接点击install,或者点击download下载安装包
然后运行安装包,指定个目录,直接一直next就行了(貌似是会自动添加环境变量)
安装后,我们来检测一下是否安装成功:
运行cmd,输入node -v
如果和下图一样会显示你的版本号,那么就代表你已经把node.js在你的机子上撸出来了。。
二:hello world!
正如我前面所说,在node.js中,http是首要的。
我们新建一个文件夹(比如我在e盘的根目录下建立了一个名字叫gn00的文件夹):
下一步进入文件夹,我们创建一个文本,名字改为:app.js(当然一般来说什么都可以)
然后我们输入一段代码
[mw_shl_code=javascript,true]
var http = require('http');
server = http.createServer(function (req, res) {
res.writeHeader(200, {"Content-Type": "text/plain"});
res.end("Hello Takk...\n");
})
server.listen(8000);
console.log("httpd start @8000");
[/mw_shl_code]
然后运行cmd,用cd命令到你那个文件夹的位置
比如我的文件夹路径为E:\gn00,我就是输入:
e:
cd gn00
然后就会是这个样子
接着输入node app (这里是你那个文件的文件名)
最后你只要打开你的浏览器(最好是谷歌浏览器,或者火狐)
然后你就可以看到效果了。
至此,我们的hello world部分就算是完成了。
下一章我会解释前面那段代码的意思~~
然后开始正式的node.js之路、。
[查看全文]



本帖最后由 基叔 于 2013-5-17 16:59 编辑
大腿好酸! 酸的看不下书了,于是来写教程。
二,Cocos2d-html5 开发环境搭建
1, 工欲善其事,必先利其器,我们需要准备以下工具
1,Cocos2d-html5 2.1.3引擎 戳我下载
2,Sublime text 编辑器 点我至官网下载
3,Wamp 服务器 至官网下载
2, 将 Wamp 和 Sublime text 一步步安装,点击 运行wamp,
找到安装目录,打开wamp,打开www [目录如下 C:\wamp\www ]
将下载好的cocos2d-html5 解压进入,如图
3, 打开浏览器 [ 推荐chrome ,360极速, IE10,Firefox,Opera ],输入http://localhost/ 看效果
4,新建我们自己的项目 Asteroids
复制 template
并重命名为 Asteroids
修改 index.html ,找到 *本站禁止HTML标签噢* 标签,添加如下一行
[mw_shl_code=html,true] *本站禁止HTML标签噢* <a href="Asteroids/index.html">Asteroids</a> <span class="comment">射击小行星</span></li>
[/mw_shl_code]
ctrl + c 保存
打开浏览器,输入http://localhost/ ,戳开
得到如下画面
好啦我们的项目已经新建好了,下一回我们开始制作游戏
[查看全文]