若要将Silverlight解决方案部署到 SharePoint，通过 Silverlight 项目创建生成的结果 .xap 文件必须位于 C:\Program Files\Common

Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin 文件夹中。

方法一：

1.右键单击“SPSilverlight”节点，单击“属性”，然后选择“生成”。

2.将“输出路径”更改为 C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin。

3.进入网站选择页面顶部的“编辑”图标，单击“插入”，然后单击“Web 部件”，从“类别”列表中单击“媒体和内容”，从“Web 部件”列表中单击“Silverlight Web 部件”，然后单击“添加”，在“Silverlight Web 部件”对话框中，键入/_layouts/ClientBin/SPSilverlight（你起的名称）.xap 作为 URL，然后单击“确定”。

方法二：

1.右击选择生成解决方案

2.右击“在windows资源管理器中打开文件夹”，Bin, Debug 中找到.xap文件复制到C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin 文件夹中

3.进入网站选择页面顶部的“编辑”图标，单击“插入”，然后单击“Web 部件”，从“类别”列表中单击“媒体和内容”，从“Web 部件”列表中单击“Silverlight Web 部件”，然后单击“添加”，在“Silverlight Web 部件”对话框中，键入/_layouts/ClientBin/SPSilverlight（你起的名称）.xap 作为 URL，然后单击“确定”。

在svg图形中，很重要的概念就是坐标系。首先分析一下width、height、viewBox这三个属性。

width:宽度，这个宽度是指在页面中实际使用的大小，跟div中定义width是同样的含义。

height：高度，含义同上。

viewBox:视图框，是一个由字符串表示的，格式："0 0 2050 1000",--->(ULCx ULCy UUwidth UUheight)

ULCx 与 ULCy 分別代表「左上角 x」与「左上角 y」。UUwidth 与UUheight 分別代表「使用者单位宽度」与「使用者单位高度」

一般而言，会在使用者空间内，将 SVG 图形物件绘製到相对於使用者空间 (也就是使用者座标系统) 的位置。以相对静态的图形来缩放和移动瀏览时，SVG 图形物件通常绝不会在使用者座标系统中移动；而是使用者座标系统本身会在 (相对於) SVG 检视区中移动 (延著所有其附加的图形)。因此从检视区的观点来看，图形物件已经移动。也就是说，您通常是移动或转换附加图形物件的使用者座标系统，而非图形物件本身。

基於上述说明，ULCx、ULCy、UUwidth 与 UUheight 这四个数字的解释如下：
ULCx 与 ULCy - 会移动使用者座标系统 (会在裡面绘製图形物件) 的原点，这样该点 (ULCx, ULCy) 就会出现在定义的 SVG 检视区的左上角。也就是，将在检视区中移动使用者座标系统视觉化，这样使用者座标点 (ULCx、 ULCy) 就会发生在 SVG 检视区的左上角。这最后将会变成沿著所有「附加」的图形物件移动与检视区相对的使用者座标系统原点。
例如：

<svg width="300px" height="200px" viewBox="0 0 300 200">
在此例中，水平方向每 300 个使用者单位会有 300 像素，而垂直方向每 200 个使用者单位就会有 200 像素。换句话说，每个使用者单位等於一个像素。

<svg width="300px" height="200px" viewBox="0 0 600 400">

然而，在下列范例中，水平方向每 600 个使用者单位会有 300 像素 (或是每个使用者单位 0.5 像素)，而垂直方向每 400 个使用者单位就会有 200 像素 (或是每个使用者单位 0.5 像素)。请注意，这项变更会造成所有的图形物件大小减半。

JS操作svg:

1、获取子元素：firstChild, firstElementChild,这是由于svg文件中可能会引入<?xml version="1.0" encoding="utf-8"?>这样的内容，这时firstChild就会表示这些非HTMLElement元素，包括空格、回车。

2、设置属性：setAttribute('name','value');

3、设置text标签的值：textSvg.firstChild.data ='40',或者使用textContent,其中有一个属性wholeText,但不可用,或者直接textSvg.textContent = '40';

例子一：创建一个circle

gearCircleElement = document.createElementNS("http://www.w3.org/2000/svg", "circle");
gearCircleElement.id = ‘circle’;
gearCircleElement.cx.baseVal.value = 34;
gearCircleElement.cy.baseVal.value = 43;
gearCircleElement.r.baseVal.value = 12;
gearCircleElement.style.fill = '#f00';

例子二：创建文本

gearTextElement = document.createElementNS("http://www.w3.org/2000/svg", "text");
gearTextElement.id = ‘text’;
gearTextElement.setAttribute("x", 67);
gearTextElement.setAttribute("y", 34);
gearTextElement.setAttribute("transform", "translate(3, -3)"); // Offset the text from the center of the circle.
gearTextElement.textContent = "##" ;
gearTextElement.setAttribute("font-size", 10);

例子三：创建直线

gearLineElement = document.createElementNS("http://www.w3.org/2000/svg", "line");
gearLineElement.id = "line";
gearLineElement.x1.baseVal.value = 3;
gearLineElement.y1.baseVal.value = 56;
gearLineElement.x2.baseVal.value = 12;
gearLineElement.y2.baseVal.value = 43;
gearLineElement.style.stroke = "white";

lie

j

jsc

　　在过去的几年中，不断涌现出的新的自定义网站设计技术。一个非常流行的想法是把所有的主要内容放在一个页面，使用动态滚动动画来定位内容，这种单页布局在只需要显示相关信息的一小部分的目标网页和移动应用程序制作网站经常使用。

　　在这篇文章中，我想向大家介绍单页网站中一些有趣的技术。希望这些想法能够给正在寻找这方面内容的年轻设计师提供灵感。

　　可能是因为实现这种效果比较复杂，视差滚动的概念对于很多设计师来说仍然是相当陌生。我看到过众多优秀的例子，例如像 Pixel Stadium 这样的杰出代表，这个网站易于浏览，纹理也是让人眼花缭乱。

　　当你向下滚动页面的时候，顶部导航栏会出现并锁定到窗口，这使得用户可以快速跳过或转换页面到不同的部分。布局是完全响应式设计的，会自适应浏览器窗口的宽度！这一切都说明，单页的布局可能会非常好看，也很灵活。

　　Android 和 iOS 应用程序开发人员知道，推出品牌对于自己的营销努力是至关重要的。这就是为什么更小的移动应用程序的网站包含的信息通常设在一个页面上。它花费更少的精力而且效果看起来也好多了。

　　这个网站采用了相当简约的布局，没有很多细节。大部分的设计是围绕应用程序的屏幕截图，环绕着 App Store 的徽章按钮。您想促进销售的话，使用单页布局是实现这个目标最好的布局风格。

　　为了在在屏幕上节省空间，网站的导航条只有在滚动条滚动一定的距离，头部的内容看不到了之后才出现。网站 Radiologie 为这种技术提供了一个很好的示范。

　　让当前的导航栏和网站的主题匹配是很好的做法，但是，因为它会在页面上保持固定，理论上你可以使用任意数量的设计风格。我想一个更好的例子是 Rule of Three。

　　他们的网站是专注于一个撰稿人行业协会的专业人士，使用暗色风格纹理，配色方案也符合版面设计。当你向下滚动页面，你会发现导航链接固定在顶栏，这是一个很好的解决方案。

　　创建自己的动态页面动画的过程很复杂的。我不建议刚开始使用 JavaScript 的开发者走这条道路，但它可以是一个很好的学习经验。看一个例子：FK-Agency website。

　　这个网站是可以同时在垂直和水平方向扩展。请注意，你不能在布局上/下翻页，必须滑动导航链接。在某些类似的服务和作品集网站中也会这种设计，你必须水平方向上滚动页面。对于一些访客，这种技术会让他们困惑，所以要小心使用。

　　这种技术和动态过渡风格是非常相似的，但水平滑动效果只要通过谷歌搜索就能找到很多的开源插件可以实现。因此这种效果相比上面几种更简单。下面是我很喜欢的一个网站例子。

　　这里收集的单页网站非常值得关注，都是单页面布局的优秀作品。可以验证上面这些观点，为设计师提供更多的帮助。这些网站使用不同的布局，你会发现各种各样的不同的用户界面技术。另外，请记得给个评论，让我们知道您的想法。

Teamgeek

Funny Faces Camera

Dash Creative

Kinderfotografie

Lost Phone Experiment

Marketing Facts

State of the Economy

Touch Gesture Icons