个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我尝试创建多边形作为菜单的背景 ( please see this attachment )，它应该缩放(响应式设计)。
我是否需要监听大小变化并使用 javascript 更改 main_menue_polygon 多边形元素的点？也许有更好、更干净的 css 实现？
请注意，我将使用 Bootstrap 。菜单应从 Bootstrap 主容器左侧约 50px 处开始，到 Bootstrap 主容器右侧约 50px 处结束。
<div style="width: 1138px; height: 555px">
<img src="example-picture1.jpg"
</div>
<svg width="1300" height="200" id="main_menue_svg">
<polygon id="main_menue_polygon" points="0,0 33,33 0,66 1244,66 1211,33 1244,0 0,0"
style="fill:rgb(51, 76, 25);stroke:rgb(51, 76, 25);stroke-width:0;fill-rule:evenodd;" />
</svg>
最佳答案
您可以使用边界框来设置 svg 的宽度/高度和 viewBox。下面的示例使用您的多边形，并响应窗口大小和调整大小。
<!DOCTYPE HTML>
<html>
<head>
<title>Resize Polygon</title>
</head>
<body>
<svg style='position:absolute;top:0px;left:0px;' >
<polygon id="main_menue_polygon" points="0,0 33,33 0,66 1244,66 1211,33 1244,0 0,0"
style="fill:rgb(51, 76, 25);stroke:rgb(51, 76, 25);stroke-width:0;fill-rule:evenodd;" />
</svg>
<script>
//--onload, onresize----
function resizePolygon()
{
var mySVG=document.getElementsByTagName("svg")[0]
var svgW=window.innerWidth
var svgH=window.innerHeight
var bb=mySVG.getBBox()
var bbx=bb.x//-300
var bby=bb.y
var bbw=bb.width
var bbh=bb.height
mySVG.setAttribute("viewBox",bbx+" "+bby+" "+bbw+" "+bbh )
mySVG.setAttribute("width",svgW)
mySVG.setAttribute("height",svgH)
}
resizePolygon(); //---init window---
document.addEventListener("onload",resizePolygon(),false)
window.onresize=resizePolygon</script>
</body>
</html>关于javascript - 动态的，依赖多边形 - html5 中的 svg，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43031558/
25
4
0
我在 gobject 上阅读了一个维基百科页面，上面写着， Depending only on GLib and libc, GObject is a cornerstone of GNOME and
如何注册一个依赖属性，其值是使用另一个依赖属性的值计算的？ 由于 .NET 属性包装器在运行时被 WPF 绕过，因此不应在 getter 和 setter 中包含逻辑。解决方案通常是使用 Proper
我一直在尝试将 ActionbarSherlock maven 依赖项添加到我的项目中 com.actionbarsherlock library 4.2.0 在我的 po
http://tutorials.jenkov.com/ood/understanding-dependencies.html#whatis说(强调我的): Whenever a class A us
我对所有这些魔法有点不清楚。 据我了解，依赖属性是从 DependencyObject 继承的，因此存储值: 如果分配了值(在本地字典中)，则在实例本身中 或者如果未指定值，则从指向父元素的链接中获取
我刚刚更新了在 ASP.NET Framework 4.5.2 版上运行的 MVC Web 应用程序。我正在使用 Twilio 发送 SMS 消息: var twilio = new TwilioRe
我刚刚发现了一件令人生畏的事情。 spring 依赖坐标有两个版本。 项目依赖于 spring mvc 和 spring flow。有两组并行的依赖项。 Spring MVC 具有以下方案的依赖项
我正在尝试包含 的 maven 依赖项 org.jacorb jacorb 2.3.1 依赖已解决，但它导致另一个依赖 picocontainer 出现问题: [ERROR
我正在尝试在 Haskell 项目中包含特定版本的库。该库是住宿加早餐型的(用于 martix 操作)，但我需要特定的 0.4.3 版本，该版本修复了乘法实现的错误。 所以，我的 stack.yaml
有谁知道如何制作依赖的 UIPickerView.例如，当我选择组件一的第 2 行时，组件二的标题会发生变化吗？ 我在互联网上查找过，没有真正的答案，我尝试过使用 if 和 switch 语句，但它们
我正在编写一个用于验收测试的项目，由于各种原因，这依赖于另一个打包为 WAR 的项目。我已成功使用 maven-dependency-plugin 解压 WAR，但无法让我的项目包含解压的 WEB-I
或多或少我在 session 上大量构建我的网站(特别是重定向用户等)，我很好奇这是否是一种危险的做法。禁用浏览器 cookie 保存的用户的大致比例是多少？我愿意接受任何建议:) 谢谢 最佳答案 s
开始玩 Scala futures，我被依赖的 futures 困住了。 让我们举个例子。我搜索地点并获得 Future[Seq[Place]]。对于这些地点中的每一个，我搜索最近的地铁站(该服务返回
或多或少我在 session 上大量构建我的网站(特别是重定向用户等)，我很好奇这是否是一种危险的做法。禁用浏览器 cookie 保存的用户的大致比例是多少？我愿意接受任何建议:) 谢谢 最佳答案 s
我有一个二进制文件，需要一些 *.so 文件才能执行。现在，当我尝试在一些旧机器上执行它时，它会显示 /lib/libc.so.6: version `GLIBC_2.4' not found 如何将
我尝试使用 Dygraph 来表示图表，我在 https://github.com/danvk/dygraphs 中找到了代码，但是它有太多的依赖文件，我觉得很烦人。是否有一个文件可以容纳所有必需的
我正在处理一个 javascript 文件，该文件 a) 声明一个具有函数的对象，并且 b) 使用它期望在外部声明的散列调用该对象的 init 函数。我的 Jasmine 规范提示它找不到哈希，因为它
最近我一直在学习 Angular 并且进展顺利，但是关于依赖注入(inject)的一些事情我仍然不清楚。 是否有任何理由在我的 app.js 文件中声明我的应用程序的其他部分(服务、 Controll
考虑一个名为 foo 的表，它有 id (PRIMARY & AUTO_INCREMENT) 列。我正在向该表中插入一行，挑战从此时开始。 $db->query("INSERT INTO `foo`
我正在使用级联下拉 jquery 插件。 (https://github.com/dnasir/jquery-cascading-dropdown) 我有两个下拉菜单。 “客户端”和“站点”。 根据您
我是一名优秀的程序员,十分优秀！