小编Dof*_*f3n的帖子

使用CSS3对角切割图像

如何使用CSS3对角切割部分图像或容器?

需要切除的部分具有三角形的形状

图像示例

更具体地说:如果上面的图片是图像,则应该剪切蓝色部分,而不是黄色

HTML应该是:

<figure>
 <img src="img_pulpit.jpg" alt="The Pulpit Rock">
</figure>
Run Code Online (Sandbox Code Playgroud)

要么:

<div class="container">
  content
</div>
Run Code Online (Sandbox Code Playgroud)

我自己的调查有很多方法可以做到这一点,但大多数都是hacky,所以寻找最好的方法

最低浏览器支持:IE11,最新webkits等

html css css-shapes

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

Cordova Phonegap和Google Maps v3 javascript api:如何在点击许可链接或Google地图徽标时添加后退按钮功能

背景: 在Android上运行的Cordova phonegap 2.2应用程序允许收听后退按钮事件

document.addEventListener("backbutton", function(e){ history.back();}
Run Code Online (Sandbox Code Playgroud)

谷歌地图api V3创建地图,其中谷歌徽标链接到左下角的谷歌地图网页和右下角的可点击许可链接.徽标或服务条款链接没有特定的ID /选择器.

问题 当点击其中一个链接时,网页会被重定向到带有:target:_blank的Google网页,然后该网站会在与Cordava应用程序相同的窗口中打开,但后退按钮功能会丢失,因为该网页包含自己的Javascript.

是否可以在加载网页时注入一些代码?

一种解决方案可能是在外部打开链接:

navigator.app.loadUrl([href here], { openExternal:true } );
Run Code Online (Sandbox Code Playgroud)

但是又一次仍然存在缺乏选择者的问题.

更新:在许可页面或Google地图中单击按钮时,我在logcat中收到以下错误消息:11-13 16:20:30.500:E/Web控制台(31508):未捕获的ReferenceError:未定义cordova:1

html5 android google-maps cordova

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

使用 Typescript 的通用映射器

这里的用例是使用泛型将带有 json 结果的获取响应映射到更复杂的类中。

例如,预期返回类型在mapper<T,U>(U json)哪里。T并且U是可选的 json 类。

U可以是一个数组,例如导致T[]或被Array<T>映射。

例如给定一个User

interface CustomAdressImplementation {
  street: string;
  streetNumber: string;
  city: string;
  zip: string;
}

interface User {
  id: string;
  birthDate: Date;
  name: string;
  address: CustomAdressImplementation;
}
Run Code Online (Sandbox Code Playgroud)

示例 json UserJson

[
  {
    "id": 1,
    "birthdate": "2020-02-20T10:00:19.145Z"
    "name": "Leanne Graham"
    "address": {
      "street": "Kulas Light",
      "streetNo": "2b"
      "suite": "Apt. 556",
      "city": "Gwenborough",
      "zipcode": "92998-3874",
      "geo": {
        "lat": "-37.3159",
        "lng": "81.1496"
      } …
Run Code Online (Sandbox Code Playgroud)

typescript

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

防止在输入之间拖放文本选择

我已经在最新的 chrome 和 IE11 中对此进行了测试。

可以在输入中选择文本,然后将其拖到另一个输入中,至少在 IE11 和 chrome 中。

我想防止这种情况发生。

我发现很多示例/教程展示了如何在有关如何实现拖放的示例中防止相反的情况:允许拖动,同时防止文本选择。

但我想允许在鼠标拖动时选择文本 - 但防止所选文本可拖动。

设置 css 属性 -webkit-user-drag: none; 还可以防止文本选择,我原以为属性是:-webkit-user-select: auto; 将控制防止文本选择。

这是一个 jsfiddle:https ://jsfiddle.net/9g419erc/

input {
  -webkit-user-select: auto;
  user-select: auto;
  -webkit-user-drag: none;
}
Run Code Online (Sandbox Code Playgroud)
<article>
    <input type="text" placeholder="Write text, select it, and drag">
    <input type="text" placeholder="Then drop text here">
</article>
Run Code Online (Sandbox Code Playgroud)

首选仅使用 css3 的解决方案

html css

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

标签 统计

css ×2

html ×2

android ×1

cordova ×1

css-shapes ×1

google-maps ×1

html5 ×1

typescript ×1