CSS Object-fit & Object-position

在响应式设计(RWD)中,我们往往采取给图片的容器设置一个尺寸,然后给图片设置下面的代码,以获得图片的自适应处理。

img {
    max-width: 100%;
    height: auto;
}

但往往需要处理的只止于此。你可能想要让图像长宽比例来填充他的整个容器,和想重新定位他的中心位置。或者,如果你想按长宽比例响应式调整iframe,你可能会真正的碰到麻烦。当然也有修复的方法,如今object-fitobject-position使开发人员可以操作<img>或<video>中的内容,类似于我们可以用background-positionbackground-size操作背景内容一样。

Read More

JavaScript Tips - Parse QueryString to Dictionary

orig.Link

The following code can be used to read what the full QueryString value is from the current pages URL:

var queryString = document.location.search;

Although, the QueryString value can be accessed from JavaScript, it isn’t parsed and separated out into any kind of Key/Value pairs automatically. This parsing must be done manually. Below is an example parsing function and it’s example usage:

Read More