馨馨家园顶客家园论坛
您现在的位置 > > 主页>教程>网页制作>

JS扩展Photoshop新功能

PS前端架构辅助v2.0.1版2007-11-14发布,欢迎各位前端架构师下载试用,欢迎反馈使用建议。 字串5

推出目的,可以快速生成HTML代码和CSS样式--选中一个选区,按下F2,代码立即生成图片也立即保存好了 字串7

相信Photoshop是“凡是称得上电脑高手”的人都会的图片处理软件,鸽子也特别喜欢画画(设计),这个软件也用得特溜,闭着眼都可以玩了。呵,于是也就想到为Photoshop增加新功能。记得去年工作的时候扩展了CorelDraw,发现功能还真实用。

字串3

升级日志字串3

升级时间2007-11-14,主要升级特性: 字串4

增加导出背景重复设置; 字串6

注:安装或使用过程中遇到了问题,请向我发邮件,我的伊妹儿/MSN/QQ都是:www[at]xiaogezi.cn。 字串5

运行环境

字串6

效果如图:

字串9

字串1

最新版下载地址:xExportv2.0.1.rar

字串6

安装方法字串5

把解压的:xExportv2.0.1.jsx 拷贝到 C:\Program Files\Adobe\Photoshop CS3\Presets\Scripts, 打开Photoshop CS3,“窗口”-> “动作”-> 打开“动作面板”,新建动作,设置快捷键为F2。在面板选项里选择“选择菜单项” -> “文件” -> “脚本” -> “xExportv2.0.1.jsx” (如果脚本列表里面没有,请选择“浏览”来选择)。

字串2

使用方法字串1

使用框选工具,选择要导出图片的部分,设置要保存图片的位置(默认是D:\),按下F2,轻松设置即可生成符合W3C标准的HTML代码,图片也保存好了。

字串2

操作案例
http://www.esieo.com/demo/ 这个网页的HTML文档的代码就是精彩案例。 字串1

#target photoshop
app.bringToFront();
$.localize = true;
/*
程式名:扩展Photoshop之导出选区到图片并生成DIV CSS(xhtml)代码;
  Code By Linr Chen,My website http://www.nihaoku.cn/ http://www.xiaogezi.cn/
JavaScript File Name:xExport.jsx
*/
if (app.documents.length == 0)
{
var docRef = app.documents.add();
}
else
{
var docRef = app.activeDocument;
var obj = docRef.selection;
}
var okBtn = "确定";
var cleBtn = "取消";
var strTitle=" 图片到源代码 Image to HTML - Linr Studio";
var strButtonBrowse = localize("$$$/JavaScripts/ExportLayersToFiles/Browse=&Browse...");
var dlg;
/* 创建Win form 窗体 */
function createDlg(css,htm)
{
dlg = new Window("dialog",strTitle,[200,250,630,560],undefined);
dlg.orientation = 'column';
dlg.alignChildren = 'left';
dlg.toHTMLIDlbl = dlg.add( 'statictext', [10,12,55,30], 'DIV ID:', '');
dlg.toHTMLID = dlg.add( 'edittext', [56,10,220,30], '', {multiline:false, readonly:false} );

字串8


dlg.toHTMLbtn = dlg.add("button",[222,8,320,32],"生成DHTML...");
.... 字串5

代码过长故省略,可以通过下载附件来查看 字串8

来源:蓝色理想 作者:vickeychen

上一篇:CSS hacks与争议
下一篇:没有了
Copyright © 2004-2008 馨馨家园 All Rights Reserved.
本站内容大多来自网络, 若有不当文章请联系本站删除. Contact: xxGarden.net#gmail.com