Skip to content

Instantly share code, notes, and snippets.

@asathoor

asathoor/README.md

Last active February 18, 2019 11:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save asathoor/7d44086a31dfec4064375df63673acb0 to your computer and use it in GitHub Desktop.
Save asathoor/7d44086a31dfec4064375df63673acb0 to your computer and use it in GitHub Desktop.
Download ZIP
Twentytwendy - jquery plugin.
Raw
README.md

Twentytwenty

Husk at inkludere disse script via jeres js/ directory (se linje 34 - 35):

    <!-- HUSK: disse filer skal ligge i js/ directoryet -->
    <script src="js/jquery.event.move.js"></script>
    <script src="js/jquery.twentytwenty.js"></script>
Raw
eksempel.html
<!DOCTYPE html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7 ]> <html class="ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]> <html class="lt-ie9" lang="en"> <![endif]-->
<!--[if IE 9 ]> <html class="lt-ie10" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>twentytwenty</title>
<link href="css/foundation.css" rel="stylesheet" type="text/css" />
<link href="css/twentytwenty-no-compass.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="row" style="margin-top: 2em;">
<div class="large-4 columns">
<h3>Basic Usage</h3>
<p>Demonstrates basic usage of the plugin.</p>
</div>
<div class="large-8 columns">
<div class="twentytwenty-container">
<img src="img/1_1.jpg" />
<img src="img/1_2.jpg" />
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<!-- HUSK: disse filer skal ligge i js/ directoryet -->
<script src="js/jquery.event.move.js"></script>
<script src="js/jquery.twentytwenty.js"></script>
<script>
$(window).load(function(){
$(".twentytwenty-container[data-orientation!='vertical']").twentytwenty({default_offset_pct: 0.7});
$(".twentytwenty-container[data-orientation='vertical']").twentytwenty({default_offset_pct: 0.3, orientation: 'vertical'});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment