小编Mar*_*ura的帖子

Flexbox:居中的元素,两侧各有一个空格元素

我正在使用flexbox设置一个由七个<li>不同宽度的元素组成的菜单.我希望我的中间(源顺序中的第4个)<li>元素始终水平居中作为一种锚点,其中1-3个<li>元素占据居中左侧的空间,<li>而第5个元素占据空间的空间对.

在此输入图像描述

我试过space-around,space-between在父Flex容器以及我试图居中align-self: center<li>元素上,但到目前为止没有运气.任何知识渊博的人的帮助将不胜感激.

的jsfiddle

css css3 flexbox

17
推荐指数
1
解决办法
1万
查看次数

Snap.load()外部SVG无法加载

问题:我正在使用Snap.svg创建一些基本的交互式图形,但由于某种原因,我无法使用加载我的外部SVG文件Snap.load().我直接从snap.io 的教程中提取代码并检查并仔细检查了文档.我的SVG文件在浏览器中呈现正常,它只是不显示在Snap SVG中.其他形状(即未使用Snap.load())会显示.

代码:我已经将我的例子简化为可以想象的最简单的HTML和SVG文件,而Snap.load()方法仍然不适合我.有谁看到我错过了什么?

HTML:

<head>
  <style media="screen">
            #svg {
                width: 300px;
                height: 300px;
            }
  </style>
  <script src="snap.svg-min.js"></script>
  <meta charset=utf-8 />
</head>
<body>
  <svg id="svg"></svg>
  <script type="text/javascript">
    var s = Snap("#svg");
    Snap.load("svgtest.svg");
  </script>
</body>
Run Code Online (Sandbox Code Playgroud)

SVG(最初从Illustrator导出):

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="100px" height="100px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve">
<rect x="14" y="33" fill="#2BB673" width="70" height="30"/>
</svg>
Run Code Online (Sandbox Code Playgroud)

更新:根据@ Ian的建议更新代码 -

var s = Snap("#svg");
Snap.load("http://www.w3.org/TR/SVG/images/struct/Use01.svg", …
Run Code Online (Sandbox Code Playgroud)

javascript svg snap.svg

11
推荐指数
2
解决办法
2万
查看次数

@font-face 在 Android 版 Chrome 中不起作用

我正在使用@font-face声明来调用网站上的字体,它会显示在IE、FF、Chrome、甚至 Mobile Safari中。但是,该字体在 Android版Chrome 18.0.1025308 (4.1.2)中不显示。

我使用的语法是fontspring 的防弹语法,我在确定是什么阻止字体正常显示时遇到了一个真正的问题。

CSS:

@font-face {
    font-family: 'jump_startregular';
    src: url('wp-content/uploads/fonts/jstart-webfont.eot');
    src: url('wp-content/uploads/fonts/jstart-webfont.eot?#iefix') format('embedded-opentype'),
         url('wp-content/uploads/fonts/jstart-webfont.woff') format('woff'),
         url('wp-content/uploads/fonts/jstart-webfont.ttf') format('truetype'),
         url('wp-content/uploads/fonts/jstart-webfont.svg#jump_startregular') format('svg');
    font-weight: normal;
    font-style: normal;
} 
Run Code Online (Sandbox Code Playgroud)

有什么想法吗?

css fonts android google-chrome font-face

5
推荐指数
1
解决办法
4234
查看次数

在jvectormap中设置单个区域的样式

所以,

我有一个自定义的jVectorMap,我已经成功地使用jVectorMap API中的代码更改了区域的颜色:

regionStyle: {
      initial: {
      fill: '#5e7073',
      "fill-opacity": 1,
      stroke: 'none',
      "stroke-width": 0,
      "stroke-opacity": 1
      },
      hover: {
      fill: 'black'
      }, 
Run Code Online (Sandbox Code Playgroud)

但我正试图单独控制地图每个区域的填充/悬停属性.有没有人这样做过或者想过如何实现它?我查看了jVectorMap API但无济于事.

马卡报

maps jquery svg region jvectormap

5
推荐指数
1
解决办法
1万
查看次数

使用Snap.svg循环动画

背景:我正在使用Snap.svg渲染一个圆,然后在悬停时为其半径设置动画.我有这个部分使用下面的代码.

问题:我试图得到一次循环的"脉冲"效应circleRadar悬停时,它会不断地涉及到初始之间动画r和新r的70虽然文档snap.animate提及(来自于... )似乎很有希望,我无法弄清楚如何在我的代码的上下文中实现它.是否有人更熟悉Snap可以提供帮助?谢谢!

代码:

//create the circle
circleRadar = s.circle(195, 345, 20);

//initial styling  
circleRadar.attr({
  fill: "#3f8403",
  opacity: 0.3
});

//animation
function testRadar(){
  circleRadar.animate({
    opacity: '1',  
  r: 70
  }, 1000, mina.elastic);
}

//trigger
circleRadar.hover(testRadar);
Run Code Online (Sandbox Code Playgroud)

javascript animation svg vector-graphics snap.svg

4
推荐指数
1
解决办法
1万
查看次数

使用 SQLite 为 apache 用户提供适当的写入权限

这个问题有很多不同的变体,但我发现没有一个变体能够真正解释应该授予哪些特定权限以允许 apache 安全/以最小的风险写入 SQLite DB。我问这个问题是因为有大量关于允许 apache 用户写入访问的一般概念的信息,但没有详细说明如何以所需的最小权限向 apache 用户授予该访问权限。

\n\n

鉴于我的网络应用程序的结构,其中 sqlite 数据库位于网络根目录之外:

\n\n
/var/\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 databases/\n\xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 myapp/\n\xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 db.sqlite3 (PERMISSIONS)\n\xe2\x94\x82\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 www/html/ (web root)\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.php\n\xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 includes/ \n\xe2\x94\x82       \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 include1.php\n\xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 ...\n
Run Code Online (Sandbox Code Playgroud)\n\n

当我调用尝试在数据库上执行写入操作的 PHP 脚本时,我在 apache2's 中收到以下错误error.log

\n\n
PHP Fatal error:  Uncaught PDOException: SQLSTATE[HY000]: General error: 8 attempt to write a readonly database in /var/www/html/includes/include1.php:xx\\nStack trace:\\n#0 /var/www/html/includes/include1.php(xx): PDOStatement->execute()\\n#1 {main}\\n  thrown in /var/www/html/includes/include1.php on line xx, referer: ...\n
Run Code Online (Sandbox Code Playgroud)\n\n

我从各种 SO 问题PDO 手册中知道,此问题的解决方案是向用户授予数据库目录的写访问权限 …

php apache sqlite lamp user-permissions

4
推荐指数
1
解决办法
6677
查看次数

使用Snap.svg选择多个路径

背景:我正在使用snap.svg为​​内联svg中的路径设置动画,我正在尝试在一个函数中设置几个路径的动画.

问题:使用下面的代码,我只能在一个抓取功能中选择一个路径.在下面的代码中,我使用了多个选择器,但动画只影响rect#rect-one.如何在Snap.svg中选择多个路径?

谢谢您的帮助!

HTML /内联SVG:

<a id="one">link</a>

<svg>
<rect  id="rect-one" fill="#231F20" width="39" height="14"/>
<rect id="rect-two" x="54" fill="#231F20" width="39" height="14"/>
<rect id="rect-three" x="104" fill="#231F20" width="39" height="14"/>
</svg>
Run Code Online (Sandbox Code Playgroud)

Snap:

window.onload = function () {
    var grabLink = Snap.select('body a#one'),
        grabPathRectangles = Snap.select('#rect-one, #rect-two, #rect-three');

    function colorPathRectangles(){
        grabPathRectangles.animate({fill: 'red'}, 100, mina.ease);
    } 
    function resumePathRectangles(){
        grabPathRectangles.animate({fill: 'green'}, 100, mina.ease);
    }   
    grabLink.hover(colorPathRectangles, resumePathRectangles);  
};
Run Code Online (Sandbox Code Playgroud)

javascript svg raphael snap.svg

3
推荐指数
2
解决办法
1万
查看次数

如何在字符串模板中替换NAME之类的子字符串?

我有一个包含我想要替换的子串的字符串,例如

text = "Dear NAME, it was nice to meet you on DATE. Hope to talk with you and SPOUSE again soon!"
Run Code Online (Sandbox Code Playgroud)

我有一个格式的csv(第一行是标题)

NAME, DATE, SPOUSE
John, October 1, Jane
Jane, September 30, John
...
Run Code Online (Sandbox Code Playgroud)

我正在尝试循环遍历csv文件中的每一行,text使用与原始子字符串匹配的标题行的列中的csv元素替换子字符串.我有一个名单matchedfields,其中包含在csv标题行中找到的所有字段text(如果csv 中有一些列我不需要使用).我的下一步是遍历每个csv行并将匹配的字段替换为该csv列中的元素.要做到这一点,我正在使用

with open('recipients.csv') as csvfile:
 reader = csv.DictReader(csvfile)
 for row in reader:
     for match in matchedfields:
        print inputtext.replace(match, row[match])
Run Code Online (Sandbox Code Playgroud)

我的问题是,它只用textcsv中的相应元素替换第一个匹配的子字符串.有没有办法同时进行多次替换,所以我最终得到了

"Dear John, it was nice to meet you on October 1. Hope to talk with you …
Run Code Online (Sandbox Code Playgroud)

python replace substring template-strings

2
推荐指数
1
解决办法
503
查看次数

使用jQuery选择具有不同数据属性的第一个元素

我有ul各种各样的项目可以有几个可能的data-attribute值之一,像这样:

<ul>
    <li id="li1" data-cat="one">test item
    <li id="li2" data-cat="one">test no 2
    <li id="li3" data-cat="two">test dummy
    <li id="li4" data-cat="three">test no 4
    <li id="li5" data-cat="three">more test
    <li id="li6" data-cat="three">test no 6
</ul>
Run Code Online (Sandbox Code Playgroud)

我试图使用jQuery选择每个不同的第一项 data-cat 价值 -所以在这个例子中,li#li1,li#li3,和li#li4.我已经尝试用它构建每个元素的数组data-attribute,然后.unique像这样排序

var list = $( '[data-cat]' ).get();
listSorted = jQuery.unique( list );
$( listSorted ).addClass('active');
Run Code Online (Sandbox Code Playgroud)

但是代码刚刚选择了所有元素(参见这里的小提琴)

我已经找到了类似于这个问题的答案,但它们似乎都依赖于data-attribute事先了解价值并寻找特定价值.是否可以选择具有特定data-cat值的第一个元素而不事先指定值?

arrays jquery jquery-selectors custom-data-attribute

1
推荐指数
1
解决办法
2058
查看次数