Skip to content

Instantly share code, notes, and snippets.

Jesper Wøldiche woeldiche

Block or report user

Report or block woeldiche

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@woeldiche
woeldiche / factboxcardinfo1.html
Created Dec 12, 2013
Factbox markup examples.
View factboxcardinfo1.html
<h2>Heading</h2
<ul>
<li>
<h3>Key</h3>
<p>Value</p>
</li>
<li>
<h3>Key</h3>
<p>Value</p>
</li>
View tabbox.html
<div class="bl-tabbox">
<ul aria-hidden="true" class="tabs">
<li><a href="#tab1">Tab 1</a></li>
<li><a href="#tab2">Tab 2</a></li>
<li><a href="#tab3">Tab 3</a></li>
<li><a href="#tab4">Tab 4</a></li>
<li><a href="#tab5">Tab 5</a></li>
</ul>
<ul class="sec-tabcontent">
<li id="tab1">
View SCOPE Cover Video
<div class="block-covervideo" id="video-layer">
<video id="vid1" class="video-js vjs-default-skin el-covervideo"
width="320"
height="180"
controls
poster='[STI TIL BILLEDFIL]'
data-cookie="scope[ISSUE NUMMER]"
data-hd='[LINK TIL HD VIDEO]'
data-sd='[LINK TIL STANDARD VIDEO]'
data-setup='{ "loop": false, "autoplay": false }'
@woeldiche
woeldiche / picture-module-example.html
Created Nov 22, 2013
Example output from the picture module.
View picture-module-example.html
<div class="field field-name-field-image field-type-image field-label-hidden">
<div class="field-items">
<div class="field-item even" rel="og:image rdfs:seeAlso" resource="http://picture7w.h011.attiks.com/sites/picture7w.h011.attiks.com/files/styles/piccustom_user_tablet_1_5x/public/field/image/38054784.jpg?itok=zyO3uMRu">
<span data-picture="">
<span data-src="http://picture7w.h011.attiks.com/sites/picture7w.h011.attiks.com/files/styles/piccustom_user_tablet_1_5x/public/field/image/38054784.jpg?itok=zyO3uMRu" data-width="1300" data-height="867"></span>
<span data-media="all and (min-width: 0px) and (max-width: 559px)" data-srcset="http://picture7w.h011.attiks.com/sites/picture7w.h011.attiks.com/files/styles/piccustom_user_mobile_1x/public/field/image/38054784.jpg?itok=S7-pbzkq 1x, http://picture7w.h011.attiks.com/sites/picture7w.h011.attiks.com/files/styles/piccustom_user_mobile_1_5x/public/field/image/38054784.jpg?itok=J8RpvmvA 1.5x, http://picture7w.h011.attiks.com/sites/pictur
@woeldiche
woeldiche / cover-video-final
Created Oct 15, 2013
Scope cover video element, final version :-)
View cover-video-final
<div class="block-covervideo" id="video-layer">
<video id="vid1" class="video-js vjs-default-skin el-covervideo"
width="320"
height="180"
controls
poster='/sites/default/files/general/Scope04_Frontpage_1200x675px.jpg'
data-cookie="scope42"
data-hd='http://player.vimeo.com/external/72242208.hd.mp4?s=940c262b3ac59c043a2be9c0f61d494b'
data-sd='http://player.vimeo.com/external/72242208.sd.mp4?s=293906304be4160dfe287d150b7baecc'
data-setup='{ "loop": false, "autoplay": false }'
View videooverlay v2.html
<div style="width:100%; height:100%; clear:both; position:absolute; top: 0; left: 0; z-index:99; overflow:hidden;" id="video-layer">
<iframe id="player1" src="http://player.vimeo.com/video/72242208?api=1&player_id=player1&title=0&byline=0&portrait=0" width="1200" height="675" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen style="min-height: 100%; max-height: 100%; min-width: 100%; max-width: 100%; width: 100%; height: 100%; position: absolute; z-index: 50;"></iframe>
<a class="video-link" href="#" style="position: absolute; z-index: 55; bottom: 10%; left: 10%; color: #fff;">Skip Video</a>
</div>
<script type="text/javascript">
(function ($) {
"use strict";
var iframe = $('#player1')[0],
@woeldiche
woeldiche / gist:5763897
Created Jun 12, 2013
Anonymous wrapper
View gist:5763897
(function ($) {
'use strict';
// Functions with $.() here...
})(jQuery);
View frontend-trackdescription.md

Design & Frontend

Description

Building successful, useable high-performing and beautiful websites requires you to go beyond the framework. Every time.

Having a framework to build on - no matter how flexible and powerful - is only the first step. This year's frontend track will focus on implementing established best practices in both design, workflow and code.

Together we will take your Drupal websites that important step further.

Main themes

Applying frontend and UX best practices in Drupal

View fluidvideo.html
<script type="text/javascript">
(function ($) {
"use strict";
$(document).ready(function() {
Modernizr.load([
{
load : "/sites/all/themes/cowiscope/script/libs/jquery.fitvids.js",
callback : function() {
$('.fluid-video-wrapper').fitVids();
}
@woeldiche
woeldiche / videooverlay.html
Last active Dec 16, 2015
Embed vimeo, using JS API to remove itself when finished playing.
View videooverlay.html
<div style="width:100%; height:100%; clear:both; position:absolute; top: 0; left: 0; z-index:99; overflow:hidden;" id="video-layer">
<iframe id="player1" src="http://player.vimeo.com/video/63243786?api=1&player_id=player1&title=0&byline=0&portrait=0&autoplay=1" width="1200" height="675" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen style="min-height: 100%; max-height: 100%; min-width: 100%; max-width: 100%; width: 100%; height: 100%; position: absolute; z-index: 50;"></iframe>
<a class="video-link" href="#" style="position: absolute; z-index: 55; bottom: 10%; left: 10%; color: #fff;">Skip Video</a>
</div>
<script type="text/javascript">
(function ($) {
"use strict";
var f = $('#player1'),
You can’t perform that action at this time.