单击显示/隐藏按钮

时间:2017-05-30 23:16:36

标签: jquery css jquery-ui toggle transition

我是网站编程的新手,但已经成功调整了我正在使用的Wordpress主题的一些CSS代码:Expositio(wpshower / themes / expositio)。

有一个CSS页面转换代码(或者我相信):

#wrapper {
  width: 100%;
  height: 100%;
  min-height: 300px;  /*added cos there's no content!*/
  background-color: yellow; /*added for clarity*/
}

.site {
  opacity: .5; /*adjusted from 0*/
  position: relative;
  min-width: 320px;
  -webkit-transition: opacity 0.3s, left 0.3s ease-out;
  -moz-transition: opacity 0.3s, left 0.3s ease-out;
  -o-transition: opacity 0.3s, left 0.3s ease-out;
  transition: opacity 0.3s, left 0.3s ease-out;
}

.main-content,
.content-area {
  height: 100%;
  white-space: nowrap;
}


/* Infinite load */

@-webkit-keyframes buffer1 {
  0% {
    -webkit-transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
  }
}

@-moz-keyframes buffer1 {
  0% {
    -moz-transform: scale(0);
  }
  50% {
    -moz-transform: scale(1);
  }
}

@-o-keyframes buffer1 {
  0% {
    -o-transform: scale(0);
  }
  50% {
    -o-transform: scale(1);
  }
}

@-ms-keyframes buffer1 {
  0% {
    -ms-transform: scale(0);
  }
  50% {
    -ms-transform: scale(1);
  }
}

@keyframes buffer1 {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(1);
  }
}

@-webkit-keyframes buffer2 {
  0% {
    -webkit-transform: scale(0);
  }
  50% {
    -webkit-transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
  }
}

@-moz-keyframes buffer2 {
  0% {
    -moz-transform: scale(0);
  }
  50% {
    -moz-transform: scale(0);
  }
  100% {
    -moz-transform: scale(1);
  }
}

@-o-keyframes buffer2 {
  0% {
    -o-transform: scale(0);
  }
  50% {
    -o-transform: scale(0);
  }
  100% {
    -o-transform: scale(1);
  }
}

@-ms-keyframes buffer2 {
  0% {
    -ms-transform: scale(0);
  }
  50% {
    -ms-transform: scale(0);
  }
  100% {
    -ms-transform: scale(1);
  }
}

@keyframes buffer2 {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}

#infinite-loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
}

#infinite-loader.active {
  display: block;
}

#infinite-loader>* {
  display: block;
  position: absolute;
  top: -50%;
  left: -50%;
  width: 100%;
  height: 100%;
  background: #bfbfbf;
  border-radius: 50%;
}

#infinite-loader>*:nth-child(1) {
  background: transparent;
}

#infinite-loader>*:nth-child(2) {
  -webkit-animation: buffer1 0.5s infinite;
  -moz-animation: buffer1 0.5s infinite;
  -o-animation: buffer1 0.5s infinite;
  -ms-animation: buffer1 0.5s infinite;
  animation: buffer1 0.5s infinite;
}

#infinite-loader>*:nth-child(3) {
  background: transparent;
  -webkit-animation: buffer2 0.2s infinite;
  -moz-animation: buffer2 0.2s infinite;
  -o-animation: buffer2 0.2s infinite;
  -ms-animation: buffer2 0.2s infinite;
  animation: buffer2 0.2s infinite;
}
<html>

<body>
  <div class="site"> <!-- #page -->   
    <div id="wrapper"> <!-- #wrapper -->    
      <div class="main-content">  <!-- #main -->     
        <p>hello</p>
        <span id="infinite-loader"> </span>
        <span> </span>
        <span> </span>
        <span> </span>
        <!--<?php wp_footer(); ?>--->
      </div>
    </div>
  </div>
</body>

</html>

这是HTML:

    <!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" lang="en-US">
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" lang="en-US">
<![endif]-->
<!--[if !(IE 7) | !(IE 8) ]><!-->
<html lang="en-US">
<!--<![endif]-->
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>SIMON VERMEULEN</title>
    <link rel="profile" href="http://gmpg.org/xfn/11">
    <link rel="pingback" href="http://simonvermeulen.com/xmlrpc.php">
    <link rel="shortcut icon" href="http://simonvermeulen.com/wp-content/themes/expositio/favicon.png" />
    <!--[if lt IE 9]>
    <script src="http://simonvermeulen.com/wp-content/themes/expositio/js/html5.js"></script>
    <![endif]-->
    <link rel='dns-prefetch' href='//fonts.googleapis.com' />
<link rel='dns-prefetch' href='//s.w.org' />
<link rel="alternate" type="application/rss+xml" title="SIMON VERMEULEN &raquo; Feed" href="http://simonvermeulen.com/feed/" />
<link rel="alternate" type="application/rss+xml" title="SIMON VERMEULEN &raquo; Comments Feed" href="http://simonvermeulen.com/comments/feed/" />
        <script type="text/javascript">
            window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/svg\/","svgExt":".svg","source":{"concatemoji":"http:\/\/simonvermeulen.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.7.5"}};
            !function(a,b,c){function d(a){var b,c,d,e,f=String.fromCharCode;if(!k||!k.fillText)return!1;switch(k.clearRect(0,0,j.width,j.height),k.textBaseline="top",k.font="600 32px Arial",a){case"flag":return k.fillText(f(55356,56826,55356,56819),0,0),!(j.toDataURL().length<3e3)&&(k.clearRect(0,0,j.width,j.height),k.fillText(f(55356,57331,65039,8205,55356,57096),0,0),b=j.toDataURL(),k.clearRect(0,0,j.width,j.height),k.fillText(f(55356,57331,55356,57096),0,0),c=j.toDataURL(),b!==c);case"emoji4":return k.fillText(f(55357,56425,55356,57341,8205,55357,56507),0,0),d=j.toDataURL(),k.clearRect(0,0,j.width,j.height),k.fillText(f(55357,56425,55356,57341,55357,56507),0,0),e=j.toDataURL(),d!==e}return!1}function e(a){var c=b.createElement("script");c.src=a,c.defer=c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g,h,i,j=b.createElement("canvas"),k=j.getContext&&j.getContext("2d");for(i=Array("flag","emoji4"),c.supports={everything:!0,everythingExceptFlag:!0},h=0;h<i.length;h++)c.supports[i[h]]=d(i[h]),c.supports.everything=c.supports.everything&&c.supports[i[h]],"flag"!==i[h]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[i[h]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
        </script>
        <style type="text/css">
img.wp-smiley,
img.emoji {
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    height: 1em !important;
    width: 1em !important;
    margin: 0 .07em !important;
    vertical-align: -0.1em !important;
    background: none !important;
    padding: 0 !important;
}
</style>
<link rel='stylesheet' id='dashicons-css'  href='http://simonvermeulen.com/wp-includes/css/dashicons.min.css?ver=4.7.5' type='text/css' media='all' />
<link rel='stylesheet' id='admin-bar-css'  href='http://simonvermeulen.com/wp-includes/css/admin-bar.min.css?ver=4.7.5' type='text/css' media='all' />
<link rel='stylesheet' id='page-list-style-css'  href='http://simonvermeulen.com/wp-content/plugins/page-list/css/page-list.css?ver=5.1' type='text/css' media='all' />
<link rel='stylesheet' id='bg-shce-genericons-css'  href='http://simonvermeulen.com/wp-content/plugins/show-hidecollapse-expand/assets/css/genericons/genericons.css?ver=4.7.5' type='text/css' media='all' />
<link rel='stylesheet' id='bg-show-hide-css'  href='http://simonvermeulen.com/wp-content/plugins/show-hidecollapse-expand/assets/css/bg-show-hide.css?ver=4.7.5' type='text/css' media='all' />
<link rel='stylesheet' id='expositio-font-css'  href='//fonts.googleapis.com/css?family=Lusitana%3A400%2C700' type='text/css' media='all' />
<link rel='stylesheet' id='expositio-style-css'  href='http://simonvermeulen.com/wp-content/themes/expositio/style.css?ver=4.7.5' type='text/css' media='all' />
<style id='expositio-style-inline-css' type='text/css'>
html {
    height: -moz-calc(100% - 32px);
    height: -webkit-calc(100% - 32px);
    height: calc(100% - 32px);
}

@media (min-width: 951px) {
    .site-header {
        height: -moz-calc(100% - 32px);
        height: -webkit-calc(100% - 32px);
        height: calc(100% - 32px);
    }
}

@media (max-width: 782px) {
    html {
        height: -moz-calc(100% - 46px);
        height: -webkit-calc(100% - 46px);
        height: calc(100% - 46px);
    }
}
</style>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script>
<link rel='https://api.w.org/' href='http://simonvermeulen.com/wp-json/' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://simonvermeulen.com/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://simonvermeulen.com/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 4.7.5" />
<link rel="canonical" href="http://simonvermeulen.com/" />
<link rel='shortlink' href='http://simonvermeulen.com/' />
<link rel="alternate" type="application/json+oembed" href="http://simonvermeulen.com/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fsimonvermeulen.com%2F" />
<link rel="alternate" type="text/xml+oembed" href="http://simonvermeulen.com/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fsimonvermeulen.com%2F&#038;format=xml" />
<style type="text/css" media="print">#wpadminbar { display:none; }</style>
<style type="text/css" media="screen">
    html { margin-top: 32px !important; }
    * html body { margin-top: 32px !important; }
    @media screen and ( max-width: 782px ) {
        html { margin-top: 46px !important; }
        * html body { margin-top: 46px !important; }
    }
</style>
<link rel="icon" href="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-32x32.png" sizes="32x32" />
<link rel="icon" href="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon-precomposed" href="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-180x180.png" />
<meta name="msapplication-TileImage" content="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-270x270.png" />
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-38407287-1', 'auto');
  ga('send', 'pageview');

</script>
</head>

<body class="home page-template-default page page-id-1267 logged-in admin-bar no-customize-support">
    <div id="wrapper">
        <div id="page" class="hfeed site">
            <header id="masthead" class="site-header" role="banner">
                <h1 class="site-title"><a href="http://simonvermeulen.com/" rel="home">SIMON VERMEULEN</a></h1>
                <h1 class="menu-toggle">m</h1>
                <nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
                    <a class="screen-reader-text skip-link" href="#content">Skip to content</a>
                    <span id="navigation-close">&#10005;</span>
                    <div id="top-main-menu" class="menu-work-container"><ul id="menu-work" class="nav-menu"><li id="menu-item-1241" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-1241"><a href="http://simonvermeulen.com/der-untermensch/"><em>Der Untermensch</em></a>
<ul class="sub-menu">
    <li id="menu-item-1423" class="menu-item menu-item-type-post_type menu-item-object-post menu-item-1423"><a href="http://simonvermeulen.com/stills/">Stills</a></li>
    <li id="menu-item-1221" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1221"><a href="http://simonvermeulen.com/glass-shoes/">Glass Shoes</a></li>
</ul>
</li>
</ul></div>                 <div id="top-right-menu" class="menu-more-container"><ul id="menu-more" class="nav-menu"><li id="menu-item-1381" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1381"><a href="http://simonvermeulen.com/about/">About</a></li>
<li id="menu-item-1382" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1382"><a href="http://simonvermeulen.com/contact-press/">Contact / Press</a></li>
</ul></div>             </nav>
                <footer id="colophon" class="site-footer" role="contentinfo">
                        <div class="site-info">

                    </div><!-- .site-info -->
                    <div class="copyright">&#169; 2017 Simon Vermeulen. All Rights Reserved.</div>
                </footer><!-- #colophon -->
            </header><!-- #masthead -->
            <div id="header-helper"></div>

            <div id="main" class="site-main">
    <div id="main-content" class="main-content">

<article id="post-1267" class="post-1267 page type-page status-publish hentry">

    <div class="entry-content">
        <h5>News</h5>
<h6>June 8 – July 14, 2017<br />
<em>Transformation</em><br />
Le Livart, Montreal (group show)</p>
<p>Opening: June 8, 2017</h6>
<p>With Marie-Josée Bergeron, Zoé Boivin, Robert Chayer, Guillaume Cloutier, Jacynthe Cloutier, Emily Comeau, Pablo-Martín Córdoba, Alex Côté, Marc Dupuis, Antony Gasnier, Annie-Claude Généreux, Makwanda et Julia Hall, Symon Henry, Thierry Huard, Sylvie Plante, Laurence Rivest, Michaëlle Sergile, Véronique Tremblay and Éric Villeneuve.</p>
<p>For the first time in a gallery, Simon Vermeulen presents <a href="http://simonvermeulen.com/der-untermensch/"><em>Der Untermensch</em></a>, a short dance film portraying a persecuted homosexual during the Third Reich taking refuge in his imagination to find freedom from within. The <a href="http://simonvermeulen.com/glass-shoes/">glass shoes</a> featured in the film will also be exposed.</p>
<p>For further information see: <a href="http://lelivart.com">www.lelivart.com</a></p>
<p><a href="http://simonvermeulen.com/der-untermensch/"><img class="aligncenter wp-image-1480 size-large" src="http://simonvermeulen.com/wp-content/uploads/2017/03/00092948-1-1024x540.jpg" alt="" width="1024" height="540" srcset="http://simonvermeulen.com/wp-content/uploads/2017/03/00092948-1-1024x540.jpg 1024w, http://simonvermeulen.com/wp-content/uploads/2017/03/00092948-1-300x158.jpg 300w, http://simonvermeulen.com/wp-content/uploads/2017/03/00092948-1-768x405.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" /></a></p>
    </div><!-- .entry-content -->
</article><!--

--><!--

    --><ul class="gallery gallery-animated">
    <!--
    --></ul><!--

    --> </div><!-- #main-content -->


            </div><!-- #main -->
        </div><!-- #page -->
    </div><!-- #wrapper -->

    <span id="infinite-loader">
        <span></span>
        <span></span>
        <span></span>
    </span>

    <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/admin-bar.min.js?ver=4.7.5'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-slide.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-highlight.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-fold.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-blind.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-content/plugins/show-hidecollapse-expand/assets/js/bg-show-hide.js?ver=4.7.5'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-content/themes/expositio/js/functions.js?ver=20140321'></script>
<script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/wp-embed.min.js?ver=4.7.5'></script>
    <!--[if lte IE 8]>
        <script type="text/javascript">
            document.body.className = document.body.className.replace( /(^|\s)(no-)?customize-support(?=\s|$)/, '' ) + ' no-customize-support';
        </script>
    <![endif]-->
    <!--[if gte IE 9]><!-->
        <script type="text/javascript">
            (function() {
                var request, b = document.body, c = 'className', cs = 'customize-support', rcs = new RegExp('(^|\\s+)(no-)?'+cs+'(\\s+|$)');

                        request = true;

                b[c] = b[c].replace( rcs, ' ' );
                // The customizer requires postMessage and CORS (if the site is cross domain)
                b[c] += ( window.postMessage && request ? ' ' : ' no-' ) + cs;
            }());
        </script>
    <!--<![endif]-->
            <div id="wpadminbar" class="nojq nojs">
                            <a class="screen-reader-shortcut" href="#wp-toolbar" tabindex="1">Skip to toolbar</a>
                        <div class="quicklinks" id="wp-toolbar" role="navigation" aria-label="Toolbar" tabindex="0">
                <ul id="wp-admin-bar-root-default" class="ab-top-menu">
        <li id="wp-admin-bar-wp-logo" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/about.php"><span class="ab-icon"></span><span class="screen-reader-text">About WordPress</span></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-wp-logo-default" class="ab-submenu">
        <li id="wp-admin-bar-about"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/about.php">About WordPress</a>      </li></ul><ul id="wp-admin-bar-wp-logo-external" class="ab-sub-secondary ab-submenu">
        <li id="wp-admin-bar-wporg"><a class="ab-item" href="https://wordpress.org/">WordPress.org</a>      </li>
        <li id="wp-admin-bar-documentation"><a class="ab-item" href="https://codex.wordpress.org/">Documentation</a>        </li>
        <li id="wp-admin-bar-support-forums"><a class="ab-item" href="https://wordpress.org/support/">Support Forums</a>        </li>
        <li id="wp-admin-bar-feedback"><a class="ab-item" href="https://wordpress.org/support/forum/requests-and-feedback">Feedback</a>     </li></ul></div>        </li>
        <li id="wp-admin-bar-site-name" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/">SIMON VERMEULEN</a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-site-name-default" class="ab-submenu">
        <li id="wp-admin-bar-dashboard"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/">Dashboard</a>     </li></ul><ul id="wp-admin-bar-appearance" class="ab-submenu">
        <li id="wp-admin-bar-themes"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/themes.php">Themes</a>     </li>
        <li id="wp-admin-bar-menus"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/nav-menus.php">Menus</a>        </li></ul></div>        </li>
        <li id="wp-admin-bar-customize" class="hide-if-no-customize"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/customize.php?url=http%3A%2F%2Fsimonvermeulen.com%2F">Customize</a>        </li>
        <li id="wp-admin-bar-updates"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/update-core.php" title="2 Plugin Updates"><span class="ab-icon"></span><span class="ab-label">2</span><span class="screen-reader-text">2 Plugin Updates</span></a>        </li>
        <li id="wp-admin-bar-comments"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/edit-comments.php"><span class="ab-icon"></span><span class="ab-label awaiting-mod pending-count count-0" aria-hidden="true">0</span><span class="screen-reader-text">0 comments awaiting moderation</span></a>      </li>
        <li id="wp-admin-bar-new-content" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/post-new.php"><span class="ab-icon"></span><span class="ab-label">New</span></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-new-content-default" class="ab-submenu">
        <li id="wp-admin-bar-new-post"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/post-new.php">Post</a>       </li>
        <li id="wp-admin-bar-new-media"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/media-new.php">Media</a>        </li>
        <li id="wp-admin-bar-new-page"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/post-new.php?post_type=page">Page</a>        </li>
        <li id="wp-admin-bar-new-user"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/user-new.php">User</a>       </li></ul></div>        </li>
        <li id="wp-admin-bar-edit"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/post.php?post=1267&#038;action=edit">Edit Page</a>       </li></ul><ul id="wp-admin-bar-top-secondary" class="ab-top-secondary ab-top-menu">
        <li id="wp-admin-bar-search" class="admin-bar-search"><div class="ab-item ab-empty-item" tabindex="-1"><form action="http://simonvermeulen.com/" method="get" id="adminbarsearch"><input class="adminbar-input" name="s" id="adminbar-search" type="text" value="" maxlength="150" /><label for="adminbar-search" class="screen-reader-text">Search</label><input type="submit" class="adminbar-button" value="Search"/></form></div>       </li>
        <li id="wp-admin-bar-my-account" class="menupop with-avatar"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/profile.php">Howdy, admin<img alt='' src='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=26&#038;d=blank&#038;r=g' srcset='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=52&amp;d=blank&amp;r=g 2x' class='avatar avatar-26 photo' height='26' width='26' /></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-user-actions" class="ab-submenu">
        <li id="wp-admin-bar-user-info"><a class="ab-item" tabindex="-1" href="http://simonvermeulen.com/wp-admin/profile.php"><img alt='' src='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=64&#038;d=blank&#038;r=g' srcset='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=128&amp;d=blank&amp;r=g 2x' class='avatar avatar-64 photo' height='64' width='64' /><span class='display-name'>admin</span></a>       </li>
        <li id="wp-admin-bar-edit-profile"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/profile.php">Edit My Profile</a>     </li>
        <li id="wp-admin-bar-logout"><a class="ab-item" href="http://simonvermeulen.com/wp-login.php?action=logout&#038;_wpnonce=2fed4da8ed">Log Out</a>        </li></ul></div>        </li></ul>          </div>
                        <a class="screen-reader-shortcut" href="http://simonvermeulen.com/wp-login.php?action=logout&#038;_wpnonce=2fed4da8ed">Log Out</a>
                    </div>

        </body>
</html>

现在,我想在我的网页上使用切换文字链接来显示/隐藏文字(我找到了一个插件:http://showhide.bunte-giraffe.de)。

当我点击切换链接时,会触发页面转换动画,使页面内容消失,但保持在同一页面上。

有人可以帮助我吗,我甚至不确定问题是否是CSS ......

如果您需要任何进一步的信息,请与我们联系!

非常感谢你!

1 个答案:

答案 0 :(得分:0)

你正在加载jquery两次 - 只加载一次。我编辑了你的css以删除标题中的css并将它放在一起,我添加了几个类来调整图像大小,但你也可以使用媒体查询。你可以将这个css放在外部样式表中,或者看它是wordpress,只需编辑主题。

我不明白你对切换/转换的意思..你能详细说明......

* html,
body {
  margin-top: 32px !important;
}

html {
  height: -moz-calc(100% - 32px);
  height: -webkit-calc(100% - 32px);
  height: calc(100% - 32px);
}

img.wp-smiley,
img.emoji {
  display: inline !important;
  border: none !important;
  box-shadow: none !important;
  height: 1em !important;
  width: 1em !important;
  margin: 0 .07em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
}

img.size-large {
  margin: 0 auto;
  text-align:center;
  max-width: 1024px;
  height: auto;
}

img.size-medium {
  margin: 0 auto;
  text-align:center;
  max-width: 768px;
  height: auto;
}

img.size-small {
  margin: 0 auto;
  text-align:center;
  max-width: 480px;
  height: auto;
}

@media (min-width: 951px) {
  .site-header {
    height: -moz-calc(100% - 32px);
    height: -webkit-calc(100% - 32px);
    height: calc(100% - 32px);
  }
}

@media (max-width: 782px) {
  html {
    height: -moz-calc(100% - 46px);
    height: -webkit-calc(100% - 46px);
    height: calc(100% - 46px);
  }
}

@media print {
  #wpadminbar {
    display: none;
  }
}
<html lang="en-US">
<!--<![endif]-->

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width">
  <title>SIMON VERMEULEN</title>
  <!---  <link rel="profile" href="http://gmpg.org/xfn/11">
  <link rel="pingback" href="http://simonvermeulen.com/xmlrpc.php">
  <link rel="shortcut icon" href="http://simonvermeulen.com/wp-content/themes/expositio/favicon.png" />--->
  <!--[if lt IE 9]>
    <script src="http://simonvermeulen.com/wp-content/themes/expositio/js/html5.js"></script>
    <![endif]-->
  <link rel='dns-prefetch' href='//fonts.googleapis.com' />
  <!---  <link rel='dns-prefetch' href='//s.w.org' />
  <link rel="alternate" type="application/rss+xml" title="SIMON VERMEULEN &raquo; Feed" href="http://simonvermeulen.com/feed/" />
  <link rel="alternate" type="application/rss+xml" title="SIMON VERMEULEN &raquo; Comments Feed" href="http://simonvermeulen.com/comments/feed/" />--->
  <script type="text/javascript">
    window._wpemojiSettings = {
      "baseUrl": "https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/72x72\/",
      "ext": ".png",
      "svgUrl": "https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/svg\/",
      "svgExt": ".svg",
      "source": {
        "concatemoji": "http:\/\/simonvermeulen.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.7.5"
      }
    };
    ! function(a, b, c) {
      function d(a) {
        var b, c, d, e, f = String.fromCharCode;
        if (!k || !k.fillText) return !1;
        switch (k.clearRect(0, 0, j.width, j.height), k.textBaseline = "top", k.font = "600 32px Arial", a) {
          case "flag":
            return k.fillText(f(55356, 56826, 55356, 56819), 0, 0), !(j.toDataURL().length < 3e3) && (k.clearRect(0, 0, j.width, j.height), k.fillText(f(55356, 57331, 65039, 8205, 55356, 57096), 0, 0), b = j.toDataURL(), k.clearRect(0, 0, j.width, j.height), k.fillText(f(55356, 57331, 55356, 57096), 0, 0), c = j.toDataURL(), b !== c);
          case "emoji4":
            return k.fillText(f(55357, 56425, 55356, 57341, 8205, 55357, 56507), 0, 0), d = j.toDataURL(), k.clearRect(0, 0, j.width, j.height), k.fillText(f(55357, 56425, 55356, 57341, 55357, 56507), 0, 0), e = j.toDataURL(), d !== e
        }
        return !1
      }

      function e(a) {
        var c = b.createElement("script");
        c.src = a, c.defer = c.type = "text/javascript", b.getElementsByTagName("head")[0].appendChild(c)
      }
      var f, g, h, i, j = b.createElement("canvas"),
        k = j.getContext && j.getContext("2d");
      for (i = Array("flag", "emoji4"), c.supports = {
          everything: !0,
          everythingExceptFlag: !0
        }, h = 0; h < i.length; h++) c.supports[i[h]] = d(i[h]), c.supports.everything = c.supports.everything && c.supports[i[h]], "flag" !== i[h] && (c.supports.everythingExceptFlag = c.supports.everythingExceptFlag && c.supports[i[h]]);
      c.supports.everythingExceptFlag = c.supports.everythingExceptFlag && !c.supports.flag, c.DOMReady = !1, c.readyCallback = function() {
        c.DOMReady = !0
      }, c.supports.everything || (g = function() {
        c.readyCallback()
      }, b.addEventListener ? (b.addEventListener("DOMContentLoaded", g, !1), a.addEventListener("load", g, !1)) : (a.attachEvent("onload", g), b.attachEvent("onreadystatechange", function() {
        "complete" === b.readyState && c.readyCallback()
      })), f = c.source || {}, f.concatemoji ? e(f.concatemoji) : f.wpemoji && f.twemoji && (e(f.twemoji), e(f.wpemoji)))
    }(window, document, window._wpemojiSettings);
  </script>
  <link rel='stylesheet' id='dashicons-css' href='http://simonvermeulen.com/wp-includes/css/dashicons.min.css?ver=4.7.5' type='text/css' media='all' />
  <link rel='stylesheet' id='admin-bar-css' href='http://simonvermeulen.com/wp-includes/css/admin-bar.min.css?ver=4.7.5' type='text/css' media='all' />
  <link rel='stylesheet' id='page-list-style-css' href='http://simonvermeulen.com/wp-content/plugins/page-list/css/page-list.css?ver=5.1' type='text/css' media='all' />
  <link rel='stylesheet' id='bg-shce-genericons-css' href='http://simonvermeulen.com/wp-content/plugins/show-hidecollapse-expand/assets/css/genericons/genericons.css?ver=4.7.5' type='text/css' media='all' />
  <link rel='stylesheet' id='bg-show-hide-css' href='http://simonvermeulen.com/wp-content/plugins/show-hidecollapse-expand/assets/css/bg-show-hide.css?ver=4.7.5' type='text/css' media='all' />
  <link rel='stylesheet' id='expositio-font-css' href='//fonts.googleapis.com/css?family=Lusitana%3A400%2C700' type='text/css' media='all' />
  <link rel='stylesheet' id='expositio-style-css' href='http://simonvermeulen.com/wp-content/themes/expositio/style.css?ver=4.7.5' type='text/css' media='all' />
  <!--  <style id='expositio-style-inline-css' type='text/css'>
    style with an id???
  </style>--->
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script>
  <link rel='https://api.w.org/' href='http://simonvermeulen.com/wp-json/' />
  <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://simonvermeulen.com/xmlrpc.php?rsd" />
  <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://simonvermeulen.com/wp-includes/wlwmanifest.xml" />
  <meta name="generator" content="WordPress 4.7.5" />
  <link rel="canonical" href="http://simonvermeulen.com/" />
  <link rel='shortlink' href='http://simonvermeulen.com/' />
  <link rel="alternate" type="application/json+oembed" href="http://simonvermeulen.com/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fsimonvermeulen.com%2F" />
  <link rel="alternate" type="text/xml+oembed" href="http://simonvermeulen.com/wp-json/oembed/1.0/embed?url=http%3A%2F%2Fsimonvermeulen.com%2F&#038;format=xml" />
  <link rel="icon" href="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-32x32.png" sizes="32x32" />
  <link rel="icon" href="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-192x192.png" sizes="192x192" />
  <link rel="apple-touch-icon-precomposed" href="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-180x180.png" />
  <meta name="msapplication-TileImage" content="http://simonvermeulen.com/wp-content/uploads/2017/04/cropped-White-Site-Icon-270x270.png" />
  <!---  <script> analytics not required onSO!
    (function(i, s, o, g, r, a, m) {
      i['GoogleAnalyticsObject'] = r;
      i[r] = i[r] || function() {
        (i[r].q = i[r].q || []).push(arguments)
      }, i[r].l = 1 * new Date();
      a = s.createElement(o),
        m = s.getElementsByTagName(o)[0];
      a.async = 1;
      a.src = g;
      m.parentNode.insertBefore(a, m)
    })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');

    ga('create', 'UA-38407287-1', 'auto');
    ga('send', 'pageview');
  </script>--->
</head>

<body class="home page-template-default page page-id-1267 logged-in admin-bar no-customize-support">
  <div id="wrapper">
    <div id="page" class="hfeed site">
      <header id="masthead" class="site-header" role="banner">
        <h1 class="site-title"><a href="http://simonvermeulen.com/" rel="home">SIMON VERMEULEN</a></h1>
        <h1 class="menu-toggle">m</h1>
        <nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
          <a class="screen-reader-text skip-link" href="#content">Skip to content</a>
          <span id="navigation-close">&#10005;</span>
          <div id="top-main-menu" class="menu-work-container">
            <ul id="menu-work" class="nav-menu">
              <li id="menu-item-1241" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-1241"><a href="http://simonvermeulen.com/der-untermensch/"><em>Der Untermensch</em></a>
                <ul class="sub-menu">
                  <li id="menu-item-1423" class="menu-item menu-item-type-post_type menu-item-object-post menu-item-1423"><a href="http://simonvermeulen.com/stills/">Stills</a></li>
                  <li id="menu-item-1221" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1221"><a href="http://simonvermeulen.com/glass-shoes/">Glass Shoes</a></li>
                </ul>
              </li>
            </ul>
          </div>
          <div id="top-right-menu" class="menu-more-container">
            <ul id="menu-more" class="nav-menu">
              <li id="menu-item-1381" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1381"><a href="http://simonvermeulen.com/about/">About</a></li>
              <li id="menu-item-1382" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1382"><a href="http://simonvermeulen.com/contact-press/">Contact / Press</a></li>
            </ul>
          </div>
        </nav>
        <footer id="colophon" class="site-footer" role="contentinfo">
          <div class="site-info">

          </div>
          <!-- .site-info -->
          <div class="copyright">&#169; 2017 Simon Vermeulen. All Rights Reserved.</div>
        </footer>
        <!-- #colophon -->
      </header>
      <!-- #masthead -->
      <div id="header-helper"></div>

      <div id="main" class="site-main">
        <div id="main-content" class="main-content">

          <article id="post-1267" class="post-1267 page type-page status-publish hentry">

            <div class="entry-content">
              <h5>News</h5>
              <h6>June 8 – July 14, 2017<br> <em>Transformation</em><br><span>Le Livart, Montreal (group show)</span>>Opening: June 8, 2017</h6>
              <p>With Marie-Josée Bergeron, Zoé Boivin, Robert Chayer, Guillaume Cloutier, Jacynthe Cloutier, Emily Comeau, Pablo-Martín Córdoba, Alex Côté, Marc Dupuis, Antony Gasnier, Annie-Claude Généreux, Makwanda et Julia Hall, Symon Henry, Thierry
                Huard, Sylvie Plante, Laurence Rivest, Michaëlle Sergile, Véronique Tremblay and Éric Villeneuve.</p>
              <p>For the first time in a gallery, Simon Vermeulen presents <a href="http://simonvermeulen.com/der-untermensch/"><em>Der Untermensch</em></a>, a short dance film portraying a persecuted homosexual during the Third Reich taking refuge in his
                imagination to find freedom from within. The <a href="http://simonvermeulen.com/glass-shoes/">glass shoes</a> featured in the film will also be exposed.</p>
              <p>For further information see: <a href="http://lelivart.com">www.lelivart.com</a></p>
              <p>
                <a href="http://simonvermeulen.com/der-untermensch/"><img class="aligncenter wp-image-1480 size-large" src="http://simonvermeulen.com/wp-content/uploads/2017/03/00092948-1-1024x540.jpg" alt="" width="1024" height="540" src="http://simonvermeulen.com/wp-content/uploads/2017/03/00092948-1-1024x540.jpg"></a>
              </p>
            </div>
          </article>
          <ul class="gallery gallery-animated">
            <!--
    -->
          </ul>
          <!--

    -->
        </div>
      </div>
      <!-- #main -->
    </div>
    <!-- #page -->
  </div>
  <!-- #wrapper -->

  <span id="infinite-loader">
        <span></span>
  <span></span>
  <span></span>
  </span>

  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/admin-bar.min.js?ver=4.7.5'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect.min.js?ver=1.11.4'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-slide.min.js?ver=1.11.4'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-highlight.min.js?ver=1.11.4'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-fold.min.js?ver=1.11.4'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/jquery/ui/effect-blind.min.js?ver=1.11.4'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-content/plugins/show-hidecollapse-expand/assets/js/bg-show-hide.js?ver=4.7.5'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-content/themes/expositio/js/functions.js?ver=20140321'></script>
  <script type='text/javascript' src='http://simonvermeulen.com/wp-includes/js/wp-embed.min.js?ver=4.7.5'></script>
  <!--[if lte IE 8]>
        <script type="text/javascript">
            document.body.className = document.body.className.replace( /(^|\s)(no-)?customize-support(?=\s|$)/, '' ) + ' no-customize-support';
        </script>
    <![endif]-->
  <!--[if gte IE 9]><!-->
  <script type="text/javascript">
    (function() {
      var request, b = document.body,
        c = 'className',
        cs = 'customize-support',
        rcs = new RegExp('(^|\\s+)(no-)?' + cs + '(\\s+|$)');

      request = true;

      b[c] = b[c].replace(rcs, ' ');
      // The customizer requires postMessage and CORS (if the site is cross domain)
      b[c] += (window.postMessage && request ? ' ' : ' no-') + cs;
    }());
  </script>
  <!--<![endif]-->
  <!---wordpress crap <div id="wpadminbar" class="nojq nojs">
    <a class="screen-reader-shortcut" href="#wp-toolbar" tabindex="1">Skip to toolbar</a>
    <div class="quicklinks" id="wp-toolbar" role="navigation" aria-label="Toolbar" tabindex="0">
      <ul id="wp-admin-bar-root-default" class="ab-top-menu">
        <li id="wp-admin-bar-wp-logo" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/about.php"><span class="ab-icon"></span><span class="screen-reader-text">About WordPress</span></a>
          <div class="ab-sub-wrapper">
            <ul id="wp-admin-bar-wp-logo-default" class="ab-submenu">
              <li id="wp-admin-bar-about"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/about.php">About WordPress</a> </li>
            </ul>
            <ul id="wp-admin-bar-wp-logo-external" class="ab-sub-secondary ab-submenu">
              <li id="wp-admin-bar-wporg"><a class="ab-item" href="https://wordpress.org/">WordPress.org</a> </li>
              <li id="wp-admin-bar-documentation"><a class="ab-item" href="https://codex.wordpress.org/">Documentation</a> </li>
              <li id="wp-admin-bar-support-forums"><a class="ab-item" href="https://wordpress.org/support/">Support Forums</a> </li>
              <li id="wp-admin-bar-feedback"><a class="ab-item" href="https://wordpress.org/support/forum/requests-and-feedback">Feedback</a> </li>
            </ul>
          </div>
        </li>
        <li id="wp-admin-bar-site-name" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/">SIMON VERMEULEN</a>
          <div class="ab-sub-wrapper">
            <ul id="wp-admin-bar-site-name-default" class="ab-submenu">
              <li id="wp-admin-bar-dashboard"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/">Dashboard</a> </li>
            </ul>
            <ul id="wp-admin-bar-appearance" class="ab-submenu">
              <li id="wp-admin-bar-themes"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/themes.php">Themes</a> </li>
              <li id="wp-admin-bar-menus"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/nav-menus.php">Menus</a> </li>
            </ul>
          </div>
        </li>
        <li id="wp-admin-bar-customize" class="hide-if-no-customize"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/customize.php?url=http%3A%2F%2Fsimonvermeulen.com%2F">Customize</a> </li>
        <li id="wp-admin-bar-updates"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/update-core.php" title="2 Plugin Updates"><span class="ab-icon"></span><span class="ab-label">2</span><span class="screen-reader-text">2 Plugin Updates</span></a> </li>
        <li id="wp-admin-bar-comments"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/edit-comments.php"><span class="ab-icon"></span><span class="ab-label awaiting-mod pending-count count-0" aria-hidden="true">0</span><span class="screen-reader-text">0 comments awaiting moderation</span></a>          </li>
        <li id="wp-admin-bar-new-content" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/post-new.php"><span class="ab-icon"></span><span class="ab-label">New</span></a>
          <div class="ab-sub-wrapper">
            <ul id="wp-admin-bar-new-content-default" class="ab-submenu">
              <li id="wp-admin-bar-new-post"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/post-new.php">Post</a> </li>
              <li id="wp-admin-bar-new-media"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/media-new.php">Media</a> </li>
              <li id="wp-admin-bar-new-page"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/post-new.php?post_type=page">Page</a> </li>
              <li id="wp-admin-bar-new-user"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/user-new.php">User</a> </li>
            </ul>
          </div>
        </li>
        <li id="wp-admin-bar-edit"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/post.php?post=1267&#038;action=edit">Edit Page</a> </li>
      </ul>
      <ul id="wp-admin-bar-top-secondary" class="ab-top-secondary ab-top-menu">
        <li id="wp-admin-bar-search" class="admin-bar-search">
          <div class="ab-item ab-empty-item" tabindex="-1">
            <form action="http://simonvermeulen.com/" method="get" id="adminbarsearch"><input class="adminbar-input" name="s" id="adminbar-search" type="text" value="" maxlength="150" /><label for="adminbar-search" class="screen-reader-text">Search</label><input type="submit" class="adminbar-button" value="Search" /></form>
          </div>
        </li>
        <li id="wp-admin-bar-my-account" class="menupop with-avatar"><a class="ab-item" aria-haspopup="true" href="http://simonvermeulen.com/wp-admin/profile.php">Howdy, admin<img alt='' src='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=26&#038;d=blank&#038;r=g' srcset='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=52&amp;d=blank&amp;r=g 2x' class='avatar avatar-26 photo' height='26' width='26' /></a>
          <div
            class="ab-sub-wrapper">
            <ul id="wp-admin-bar-user-actions" class="ab-submenu">
              <li id="wp-admin-bar-user-info">
                <a class="ab-item" tabindex="-1" href="http://simonvermeulen.com/wp-admin/profile.php"><img alt='' src='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=64&#038;d=blank&#038;r=g' srcset='http://2.gravatar.com/avatar/2f1fc2ebbbe6ae67e11671b5765ee1c9?s=128&amp;d=blank&amp;r=g 2x' class='avatar avatar-64 photo'
                    height='64' width='64' /><span class='display-name'>admin</span></a>
              </li>
              <li id="wp-admin-bar-edit-profile"><a class="ab-item" href="http://simonvermeulen.com/wp-admin/profile.php">Edit My Profile</a> </li>
              <li id="wp-admin-bar-logout"><a class="ab-item" href="http://simonvermeulen.com/wp-login.php?action=logout&#038;_wpnonce=2fed4da8ed">Log Out</a> </li>
            </ul>
    </div>
    </li>
    </ul>
  </div>
  <a class="screen-reader-shortcut" href="http://simonvermeulen.com/wp-login.php?action=logout&#038;_wpnonce=2fed4da8ed">Log Out</a>
  </div>--->

</body>

</html>