MCBBS Wiki欢迎您共同参与编辑!在参与编辑之前请先阅读Wiki方针。
如果在编辑的过程中遇到了什么问题,可以去讨论板提问。
为了您能够无阻碍地参与编辑 未验证/绑定过邮箱的用户,请尽快绑定/验证。
MCBBS Wiki GitHub群组已上线!
您可以在回声洞中发表吐槽!
服务器状态监控。点击进入
本站由MCBBS用户自行搭建,与MCBBS及东银河系漫游指南(北京)科技有限公司没有从属关系。点此了解 MCBBS Wiki 不是什么>>
用户:Salt lovely/沙盒:修订间差异
跳到导航
跳到搜索
Salt lovely(留言 | 贡献) 小 (→样式测试: // Edit via Wikiplus) |
Salt lovely(留言 | 贡献) 小 (编辑“用户:Salt_lovely/沙盒” // 维基盐编辑器) |
||
(未显示同一用户的20个中间版本) | |||
第1行: | 第1行: | ||
== 测试功能 == |
|||
== 尚未实装,所以除了我以外的人都看不见2333 == |
|||
cccc[[用户:Salt_lovely|<span style="--btnw:257px;--btnh:62px;--backcolor:#574266;--fontcolor:#fff;--fontsize:2em;" class="border-btn center-txt">test</span>]] |
|||
bbbb |
|||
[https://wiki.crash-logs.cn/wiki/%E9%A6%96%E9%A1%B5 <span style="--btnw:257px;--btnh:62px;--backcolor:#fffbf0;--fontcolor:#3b2e7e;--fontsize:2em;" class="border-btn center-txt box-sdw">test</span>]aaaa |
|||
* [[/抓取MCBBS用户头像]] |
|||
<hr> |
|||
* [[/签名]] |
|||
* [[/皮肤测试]] |
|||
* [[/导航盒]] |
|||
* [[/投票箱]] |
|||
{{U:Salt lovely/沙盒/投票箱 |
|||
<span class="gard-txt-webkit" style="--gardcolor:#549688,#065279,#8c4356,#56004f;--garddeg:60deg">·这·是·一·个·渐·变·色·测·试·,'''·为·了·保·证·测·试·效·果·''',''·文·字·应·该·尽·可·能·地·长·''——使用了-webkit-,颜色可以无限多,兼容性不佳</span> |
|||
|title=这里是投票标题 |
|||
* '''坐等CSS新版本,支持 ''background-clip: text;'' 的时候吧''' |
|||
|subtitle=默认样式测试(可选)这里是投票副标题 |
|||
|#同意= |
|||
[[U:Salt]]<!-- 多行测试 --> |
|||
[[用户:Salt_lovely|{{color|#d3a|Salt Lovely}}]]<!-- 自定义用户名样式测试 --> |
|||
|*同意=用户选择同意 |
|||
|#反对=[[U:Salt|{{color|#3da|Salt111}}]] |
|||
<span class="gard-txt" style="--gardcolor1:#549688;--gardcolor2:#56004f;--garddeg:60deg">·这·是·一·个·渐·变·色·测·试·,·为·了·保·证·测·试·效·果·,·文·字·应·该·尽·可·能·地·长·——未使用-webkit-,只能用两种颜色,浏览器兼容</span> |
|||
|*反对=用户选择{{反对}} |
|||
* '''开发失败''' |
|||
|#弃权=[[User:Example]][[U:Salt|{{color|#3da|Salt111}}]][[U:Salt_lovely]] |
|||
== 新签名 == |
|||
——<span style="text-shadow:0 0 2px #012,0 0 1px #024,0 0 1px #024,0 0 1px #024,0 0 1px #024;font-family:PRISTINA,Comic Sans MS">[[Salt_lovely|<font color="#fff" size="3">Salt lovely</font>]]</span> |
|||
|#重复测试=[[U:Example]][[U:Example]][[U:Example]] |
|||
-- '''<span style="font-family:PRISTINA;font-size:medium">[[用户:Salt_lovely|<font color="#037">Salt · lovely</font>]][[用户讨论:Salt_lovely|<font color="#4c8dae"><sup>论</sup></font>]]/[[特殊:用户贡献/Salt_lovely|<font color="#466"><sub>绩</sub></font>]]</span>''' |
|||
|*重复测试=重复测试 |
|||
|#无投票1= |
|||
== 样式测试 == |
|||
<div class="article-container"> |
|||
离骚 【周】屈原 |
|||
|#无投票2= |
|||
帝高阳之苗裔兮,朕皇考曰伯庸。 |
|||
}} |
|||
{{U:Salt lovely/沙盒/投票箱 |
|||
摄提贞于孟陬兮,惟庚寅吾以降。 |
|||
|标题=压力测试 |
|||
|副标题=颜色参数 有横条 |
|||
|bar=1 |
|||
|颜色=#00F5D4,#00BBF9,#FEE440,#F15BB5,#9B5DE5 |
|||
|#1=[[用户:Salt_lovely]][[用户:Salt_lovely]][[用户:Salt_lovely]][[用户:Salt_lovely]] |
|||
|*1=我们可以看到啊,选这个的用户很多 |
|||
|#2= |
|||
|#3=[[User:Salt]][[User:Example]][[U:Example]][[用户:Example]] |
|||
|#4= |
|||
|#5= |
|||
|#6= |
|||
|#7=[[User:Salt]][[User:Example]][[User:Salt]][[User:Example]][[User:Salt]][[User:Example]] |
|||
|#8= |
|||
|#9= |
|||
|#10= |
|||
|#11= |
|||
|#12= |
|||
|#13=[[User:Salt]] |
|||
|#14=[[用户:Salt_lovely]][[用户:Salt_lovely]][[User:Salt]][[User:Example]][[U:Example]][[用户:Example]][[用户:Salt_lovely]][[用户:Salt_lovely]] |
|||
|#15= |
|||
|#16= |
|||
|#17= |
|||
|*123= |
|||
|*456=1234567890 |
|||
}} |
|||
== JS代码存档 == |
|||
皇览揆余初度兮,肇锡余以嘉名: |
|||
<pre>// MCBBS头像上传时三个大小头像切片上传代码 - 修改 - 启用抗锯齿 |
|||
// 其实就加了两行 |
|||
名余曰正则兮,字余曰灵均。 |
|||
(0, eval)(`function saveAvatar() { |
|||
var img = $('avatarimage'); |
|||
纷吾既有此内美兮,又重之以修能。 |
|||
var sd = getSelectorDimention(); |
|||
var ad = getAvatarDimension(); |
|||
扈江离与辟芷兮,纫秋兰以为佩。 |
|||
var rl = (sd.left-ad.left)/ad.width; |
|||
var rt = (sd.top-ad.top)/ad.height; |
|||
汩余若将不及兮,恐年岁之不吾与。 |
|||
var rw = sd.width/ad.width; |
|||
var rh = sd.height/ad.height; |
|||
朝搴阰之木兰兮,夕揽洲之宿莽。 |
|||
var iw = jQuery('#avatarimage').width(); |
|||
var ih = jQuery('#avatarimage').height(); |
|||
日月忽其不淹兮,春与秋其代序。 |
|||
var sl = rl*iw; |
|||
var st = rt*ih; |
|||
.... |
|||
var sw = rw*iw; |
|||
</div> |
|||
var sh = rh*ih; |
|||
<!--恶地 |
|||
var tw = sw; |
|||
恶地高原 |
|||
var th = sh; |
|||
繁茂的恶地高原 |
|||
if (sw>200 || sh>250) { |
|||
竹林 |
|||
var r = Math.max(sw/200, sh/250); |
|||
竹林丘陵 |
|||
tw = Math.floor(sw/r); |
|||
丛林 |
|||
th = Math.floor(sh/r); |
|||
丛林边缘 |
|||
} |
|||
丛林丘陵 |
|||
var canvas = document.createElement('canvas'); |
|||
桦木森林 |
|||
canvas.width = tw; |
|||
桦木森林丘陵 |
|||
canvas.height = th; |
|||
针叶林 |
|||
var ctx = canvas.getContext("2d"); |
|||
针叶林丘陵 |
|||
ctx.fillStyle = 'white'; |
|||
巨型针叶林 |
|||
ctx.fillRect(0, 0, tw, th); |
|||
巨型针叶林丘陵 |
|||
ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); |
|||
积雪的针叶林 |
|||
ctx.imageSmoothingEnabled = true; // 启用抗锯齿 |
|||
积雪的针叶林丘陵 |
|||
ctx.imageSmoothingQuality = "high"; // 高品质抗锯齿 |
|||
森林 |
|||
var dataURL = canvas.toDataURL("image/jpeg"); |
|||
繁茂的丘陵 |
|||
jQuery('#avatar1').val(dataURL.substr(dataURL.indexOf(",") + 1)); |
|||
繁茂的山地 |
|||
var tw = sw; |
|||
热带草原 |
|||
var th = sh; |
|||
热带高原 |
|||
if (sw>120 || sh>120) { |
|||
黑森林 |
|||
var r = Math.max(sw/120, sh/120); |
|||
草原 |
|||
tw = Math.floor(sw/r); |
|||
积雪的冻原 |
|||
th = Math.floor(sh/r); |
|||
沙漠 |
|||
} |
|||
沙漠丘陵 |
|||
var canvas = document.createElement('canvas'); |
|||
沙滩 |
|||
canvas.width = tw; |
|||
积雪的沙滩 |
|||
canvas.height = th; |
|||
石岸 |
|||
var ctx = canvas.getContext("2d"); |
|||
沼泽 |
|||
ctx.fillStyle = 'white'; |
|||
山地 |
|||
ctx.fillRect(0, 0, tw, th); |
|||
雪山 |
|||
ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); |
|||
冷水海洋 |
|||
var dataURL = canvas.toDataURL("image/jpeg"); |
|||
冷水深海 |
|||
jQuery('#avatar2').val(dataURL.substr(dataURL.indexOf(",") + 1)); |
|||
封冻深海 |
|||
var mwh = Math.min(sw, sh); |
|||
温水深海 |
|||
if (sw>mwh) { |
|||
温水海洋 |
|||
sl += Math.floor((sw-mwh)/2); |
|||
暖水海洋 |
|||
sw = mwh; |
|||
河流 |
|||
} |
|||
冻河 |
|||
if (sh>mwh) { |
|||
蘑菇岛海岸 |
|||
st += Math.floor((sh-mwh)/2); |
|||
蘑菇岛--> |
|||
sh = mwh; |
|||
} |
|||
== 样式存档 == |
|||
var tw = 48; |
|||
<pre>/* #bodyContent{ |
|||
var th = 48; |
|||
margin-left: auto !important;margin-right: auto !important; |
|||
var canvas = document.createElement('canvas'); |
|||
} */ |
|||
canvas.width = tw; |
|||
canvas.height = th; |
|||
/* #content:before{ |
|||
var ctx = canvas.getContext("2d"); |
|||
content:''; |
|||
ctx.fillStyle = 'white'; |
|||
left:0; |
|||
ctx.fillRect(0, 0, tw, th); |
|||
ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); |
|||
width:calc(100% - 90px); |
|||
var dataURL = canvas.toDataURL("image/jpeg"); |
|||
padding:0 45px; |
|||
jQuery('#avatar3').val(dataURL.substr(dataURL.indexOf(",") + 1)); |
|||
margin-top:-45px; |
|||
var src = $('avatarform').action; |
|||
display:block; |
|||
$('avatarform').action = data[data.indexOf('src')+1].replace('images/camera.swf?inajax=1', 'index.php?m=user&a=rectavatar&base64=yes'); |
|||
position:absolute; |
|||
$('avatarform').target='rectframe'; |
|||
background: |
|||
}`)</pre> |
|||
url(https://s2.ax1x.com/2019/11/28/QFB2X4.png)left top no-repeat, |
|||
url(https://s2.ax1x.com/2019/11/28/QFBfB9.png)right top no-repeat, |
|||
url(https://wiki.crash-logs.cn/images/2/21/body_top.png)top repeat-x; |
|||
} */ |
|||
/* #content:after{ |
|||
content:''; |
|||
left:0; |
|||
height:var(--bgtop); |
|||
width:calc(100% - 90px); |
|||
padding:0 45px; |
|||
bottom:0px; |
|||
margin-bottom:-45px; |
|||
display:block; |
|||
position:absolute; |
|||
background: |
|||
url(https://wiki.crash-logs.cn/images/7/7d/body_bottom.png)bottom repeat-xcontent-box, |
|||
url(https://s2.ax1x.com/2019/11/28/QFcINd.png)left bottom no-repeat, |
|||
url(https://s2.ax1x.com/2019/11/28/QFc5AH.png)right bottom no-repeat; |
|||
} */</pre> |
2024年3月23日 (六) 19:40的最新版本
测试功能
这里是投票标题
默认样式测试(可选)这里是投票副标题
- 同意用户选择同意
- 反对用户选择(-)反对
- 重复测试重复测试
#00F5D4,#00BBF9,#FEE440,#F15BB5,#9B5DE5
压力测试
颜色参数 有横条
- 1我们可以看到啊,选这个的用户很多
- 123
- 4561234567890
JS代码存档
// MCBBS头像上传时三个大小头像切片上传代码 - 修改 - 启用抗锯齿 // 其实就加了两行 (0, eval)(`function saveAvatar() { var img = $('avatarimage'); var sd = getSelectorDimention(); var ad = getAvatarDimension(); var rl = (sd.left-ad.left)/ad.width; var rt = (sd.top-ad.top)/ad.height; var rw = sd.width/ad.width; var rh = sd.height/ad.height; var iw = jQuery('#avatarimage').width(); var ih = jQuery('#avatarimage').height(); var sl = rl*iw; var st = rt*ih; var sw = rw*iw; var sh = rh*ih; var tw = sw; var th = sh; if (sw>200 || sh>250) { var r = Math.max(sw/200, sh/250); tw = Math.floor(sw/r); th = Math.floor(sh/r); } var canvas = document.createElement('canvas'); canvas.width = tw; canvas.height = th; var ctx = canvas.getContext("2d"); ctx.fillStyle = 'white'; ctx.fillRect(0, 0, tw, th); ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); ctx.imageSmoothingEnabled = true; // 启用抗锯齿 ctx.imageSmoothingQuality = "high"; // 高品质抗锯齿 var dataURL = canvas.toDataURL("image/jpeg"); jQuery('#avatar1').val(dataURL.substr(dataURL.indexOf(",") + 1)); var tw = sw; var th = sh; if (sw>120 || sh>120) { var r = Math.max(sw/120, sh/120); tw = Math.floor(sw/r); th = Math.floor(sh/r); } var canvas = document.createElement('canvas'); canvas.width = tw; canvas.height = th; var ctx = canvas.getContext("2d"); ctx.fillStyle = 'white'; ctx.fillRect(0, 0, tw, th); ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); var dataURL = canvas.toDataURL("image/jpeg"); jQuery('#avatar2').val(dataURL.substr(dataURL.indexOf(",") + 1)); var mwh = Math.min(sw, sh); if (sw>mwh) { sl += Math.floor((sw-mwh)/2); sw = mwh; } if (sh>mwh) { st += Math.floor((sh-mwh)/2); sh = mwh; } var tw = 48; var th = 48; var canvas = document.createElement('canvas'); canvas.width = tw; canvas.height = th; var ctx = canvas.getContext("2d"); ctx.fillStyle = 'white'; ctx.fillRect(0, 0, tw, th); ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); var dataURL = canvas.toDataURL("image/jpeg"); jQuery('#avatar3').val(dataURL.substr(dataURL.indexOf(",") + 1)); var src = $('avatarform').action; $('avatarform').action = data[data.indexOf('src')+1].replace('images/camera.swf?inajax=1', 'index.php?m=user&a=rectavatar&base64=yes'); $('avatarform').target='rectframe'; }`)