标签:start 技术 ima app 数字 org 图片 element children
摘要:JQuery - fancyBox 点选图片,放大图片显示
好久没写文章了,
没工作的情况下,实在没什么实战经验可以提供,
还好,会有一些意外的小Case,
刚好我没做过,赚一点小小外块,好让贫穷的我,还能撑个一、两个礼拜(哭哭)
------------
这次帮一位朋友的哥哥,因为非本业出身,要弄一个网页,因为要内容数字化,拍了一堆照片,要用网页显示,
好久没碰前端,应该说是JavaScript、HTML、CSS、JQuery的我,
实在记性不是很好,一直狂用Google,东凑西凑,在四个小时内完成了(没想到这样做好像也挺快的,四个小时就赚两天的薪水,对方说至少给我这样的薪水,喔,因为外面报价不知道为什么异常的高)
给了对方程序,对方给予很多的感谢,觉得我做很快,外面接案的人不但说要架服务器呀,要多少钱,结果他只要静态网页,刚好我不太会架服务器,我写静态网页还可以说,接的很愉快,省了他两天的时间(他可能不知道怎么做,可能会花更久的时间)
由其我用的是JQuery这种技术,用DW不知道能不能做得到。
而且我用JavvaScript+JQuery+Json处理,让程序自动加入DOM组件或Element,如果用DW,不知道他是否会花250次的Ctrl+C , Ctrl +V。
因为图片有259张,且每张图片都266KB,我就使用大量缩图软件,将每张图缩到宽200px,每张瞬间变成35KB。
就能在同一个页面全部显示。
http://briian.com/6561/easy-image-modifier.html
再使用javascript array ,另外引用data.js,让每张图的文字能够镜像。
再使用JQuery 套件 ,?fancyBox ,处理点选放大。
http://fancyapps.com/fancybox/
好久没做网页了,语法忘的差不多,重新回忆。
有哪些我用到的CSS
display:inline;
float:left;
font-family: "标楷体","Times New Roman", Georgia, Serif;
font-weight: bold;
clear:both;?$data.appendTo($("#div_list"));
点选跳出的范例
$data.fancybox({
helpers: {
title : {
type : ‘outside‘
},
overlay : {
speedOut : 0
}
}
});
如果我写过的话……
或许只要一小时内就弄好。
不过太久没弄,就这样弄了四小时(哭哭,幸好给的钱好多……对我来讲)
原文:大专栏 JQuery - fancyBox 点选图片,放大图片显示
标签:start 技术 ima app 数字 org 图片 element children
原文地址:https://www.cnblogs.com/petewell/p/11516487.html