egfx

<style>
.slider {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.slider__slides {
  position: relative;
  width: 400%;

egfx

<h1><span>Life</span><span>is a</span><span>gradient</span></h1>

egfx

Photo framed images

Uses the border-image property to frame an image in a somehow photo-realistic way. Additionally, a "handwritten" caption can be applied. There are some pixel based calculations in here, which is not ideal. And, of course: IE. But whatever. The jQuery part is not really neccessary; it simply helps to keep the HTML part a little cleaner. Of course, you can remove it and some of the CSS if you don't want captions at all.

A Pen by Tobias Reinhardt on CodePen.

License.

egfx

Play video portions

Code excellent for tutorials or to compile various clips in one video

A Pen by Nodws on CodePen.

License.

egfx

<h2>qKast Terms of Service and Privacy Policy</h2>

<h3>1. Terms</h3>

  <p>By accessing the website at&nbsp;<a href="https://qkast.com">https://qkast.com</a>, you are agreeing to be bound by these terms of service, all applicable laws and regulations, and agree that you are responsible for compliance with any applicable local laws. If you do not agree with any of these terms, you are prohibited from using or accessing this site. The materials contained in this website are protected by applicable copyright and trademark law.</p>

<h3>2. Use License</h3>

  <ol type="a">
    <li>

egfx

<style>
.envbg {
  background-color: #035caf;
  z-index: 0 !important;
}
.envbg.show {
  opacity: 1 !important;
}
.envbg.hide {
  display: none;

egfx

<div class="circle">
  <div class="text">Our Team</div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=69"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=64"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=65"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=52"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=41"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=33"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=22"/></div>
  <div class="image-wrapper"><img class="image" src="http://i.pravatar.cc/300?img=15"/></div>

egfx

<div class="container">
  <span class="flipper">
    <span class="front">.</span>
    <span class="back">(</span>
  </span>
  <span class="flipper">
    <span class="front">.</span>
    <span class="back">^</span>
  </span>
  <span class="flipper">

egfx

<div id="App"></div>

egfx

#dailycssimages :: 09 :: Calendar

A Pen by David on CodePen.

License.