matt-barker

CSS only menu

This could be a JS free fallback for a menu on smaller screens. Click the navicon to have the menu open!

This is done by using a checkbox which is along side the 'nav' menu. When the checkbox is checked, the menu will open. The input is the full width and height of the initial header so that it is easy to click.

Navicon is based on http://w3bits.com/animated-menu-icon-css/

A Pen by Dan Ford on CodePen.

matt-barker

<!--Testimonials-->
<!--
float > this can be either "left" or "right" to float the testimonial left or right. If you leave this out, it will default to the left. To keep things neat and stop text from getting squashed, the testimonial is only floated on desktop displays wider than 768px
text > this is the main body of the testimonial
name > this is the name of the client
background > this is the background colour of the testimonial box. If you leave this out, it will default to white.
-->
[team-testimonial float="right" text="The main testimonial text" name="The client name" background="#fff"]

<!--Read More Links-->

matt-barker

<h4>Make an Enquiry Online</h4>
<div class="team-enquiry-wrapper" style="max-width:640px;margin:0 auto;margin-top:1em;margin-bottom:1em;">
[ninja_form id=4]
</div>

matt-barker

<script>
$(function(){
  $('body').addClass('testPage')
})
</script>

<script>
$(document).ready(function(){
  $('.header-slideshow').closest('.code-block').next('.sqs-block-gallery').addClass('header-slideshow-block');
  $('.Parallax-host .Parallax-item').eq(0).addClass('header-slideshow-host');

matt-barker

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
  $(function() {
    $( "figure:eq(0)" ).wrapInner( "<div class='movementimg'></div>" );
    $("figure:eq(0)").mousemove(function(event) {
      var mx = event.pageX - $('figure:eq(0)').width();
      var my = event.pageY - $('figure:eq(0)').height();
      var mmovex = (mx)/800;
      var mmovey = (my)/800;
      $(".movementimg").css("transform", "translate(" + mmovex + "vw," + mmovey + "vh)");

matt-barker

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!--Carousel Gallery-->
<script>
$(document).ready(function(){
  $('.carousel-gallery').closest('.code-block').next('.gallery-block').addClass('carousel-gallery-block').find('.sqs-gallery-controls').hide();
  $('.carousel-gallery-block').hover(
	function() {
    $(this).find('.sqs-gallery-controls').fadeIn(200);
  	}, function() {

matt-barker

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<!---
<input type="checkbox" id="toggle-1">
<iframe id="intro" allowFullScreen frameborder="0" src="https://player.vimeo.com/video/257149296?autoplay=1&background=1&mute=0&loop=0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
<script src="https://player.vimeo.com/api/player.js"></script>

<script type="text/javascript"> 
$(document).ready(function(){

var iframe = $('iframe');   

matt-barker

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style>
#checkbox-yui_3_17_2_1_1521021812241_72024 input {
  display:none;
  }
</style>
<script>
var foodTruckLogos = [
  
  '/static/572fd357c2ea5121590e4021/5754a880f8baf31c273c841e/59e127738dd0412e6493fbf6/1521023088611/Abeetz-pizza-food-truck-Logo-square-min.png?format=100w',

matt-barker

<!-- Border image hover effect code-->
<script>
$(document).ready(function() {

  var divisor = 10, //set the strength of the effect (lower = more extreme)
    borderSpeed = 500; //set the speed of the effect (lower = faster)


  $('.border-image-start').closest('.sqs-block-code').addClass('border-image-code-block').next('.sqs-block-image').addClass('border-image-block');
  $('.border-image-start').closest('section').css({

matt-barker

Keybase proof

I hereby claim:

• I am matt-barker on github.
• I am mattbarker (https://keybase.io/mattbarker) on keybase.
• I have a public key whose fingerprint is 6A5D CA83 FA8F 1DAB D587 6F7C CCB9 A0D3 6F00 15BC

To claim this, I am signing this object: