Sto seguendo questa guida ,di html, responsive web designer sono arriva al caricamento condizionale (http://www.html.it/pag/33422/caricam...ntenuti/)della slideshow pero non mi funziona non sono molto esperto di javascript.
Ho anche un problema sulla scritta menu che si vede quando riduci la pagina dovrebbe essere bianca pero ho un effetto di hover che io non ho messo questa e la pagina giuliano75.altervista.org

Grazie a tutti per l aiuto

<!doctype html>
<html>
<head>
<meta charset="utf-8">

<!-- Mobile viewport optimized: j.mp/bplateviewport -->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Responsive Menu animato con effetto Slide Down</title>


<title>sito giuliano</title>
<!-- Style -->
<link rel="stylesheet" type="text/css" href="css/master.css">
<link rel="stylesheet" type="text/css" href="font/style.css">
<!--script js-->
<script type="text/javascript" src="js/respond.min.js"></script>
<script type="text/javascript" src="js/modernizr-2.0.6.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src=src="js/jquery-1.9.0.min.js"><\/script>')</script>
<!--[if (lt IE 9) & (!IEMobile)]>
<script src="js/respond.min.js"></script>
<![endif]-->

<!-- Flexlider -->
<script type="text/javascript" src="assets/js/jquery.flexslider-min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('.flexslider').flexslider({
animation: 'fade',
slideshow: true,
controlNav: true,
directionNav: false
});
});
</script>
<script type="text/javascript">
var caricaFlexslider = function() {
$(".flexslider").load("flexslider.html");
};
</script>
<!-- Fine Flexslider -->

<!--script navigazione-->
<script>
$(function() {
var pull = $('#pull');
menu = $('nav ul');
menuHeight = menu.height();

$(pull).on('click', function(e) {
e.preventDefault();
menu.slideToggle();
});

$(window).resize(function(){
var w = $(window).width();
if(w > 320 && menu.is(':hidden')) {
menu.removeAttr('style');
}
});
});
</script>
<!--fine script navigazione-->
<!--fine js-->
</head>

<body>


<!--inizio header-->
<header>

<!--inizio navigazio-->
<nav class="clearfix">
<ul class="clearfix">
<li id="home" ><a href="#"><span class="icon"><i aria-hidden="true" class="icon-home"></i></span><span>HOME</span></a></li>
<li ><a href="#"><span class="icon"><i aria-hidden="true" class="icon-user"></i></span><span>ABOUT</span></a></li>
<li ><a href="#"><span class="icon"><i aria-hidden="true" class="icon-quill"></i></span><span>WORKS</span></a></li>
<li ><a href="#"><span class="icon"><i aria-hidden="true" class="icon-mobile"></i></span><span>CONTACT</span></a></li>
</ul>

<a href="#" id="pull">Menu</a>
</nav>
</header>
<!--fine header-->
<!-- Inizio slideshow contenuti in evidenza -->
<div id="inevidenza" class="flexslider">

</div>
<!-- Fine slideshow contenuti in evidenza -->

<!-- Carica lo slideshow se la finestra é larga più di 768px -->
<script type="text/javascript">
if (document.documentElement.clientWidth >= 768) {
caricaFlexslider();
}
</script>
</script>
<!-- Fine caricamento slideshow -->



</body>
</html>

.icon-home, .icon-quill, .icon-user, .icon-html5, .icon-css3, .icon-google, .icon-twitter, .icon-facebook, .icon-mobile{
font-family: 'icomoon';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
}
body{
font-family: 'helvetica_neueregular', Optima-Regular, Verdana, sans-serif;
font-size: 62.5%/1,3;
color: #222;
background-color: #FFFFFF;
margin: 0;
padding: 0;
}

/* Basic Styles */
nav {
height: 80px;
width: 100%;
background: #a66bbe;
font-size: 1em;
position: relative;
border-bottom: 2px solid #283744;
}
nav ul {
padding: 0;
margin: 0 auto;
width: 600px;
height: 80px;
}
nav li {
display: inline;
float: left;
}
nav a {
color: #000000;
display: inline-block;
width: 100px;
text-align: center;
text-decoration: none;
line-height: 40px;

}
nav li a {
border-right: 1px solid #576979;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
nav li:last-child a {
border-right: 0;
}
nav a:hover, nav a:active, #home a {
color: #ffffff;
}
nav a#pull {
display: none;
}
.icon{ display:block;}

/*Styles for screen 600px and lower*/
@media screen and (max-width: 600px) {
nav {
height: auto;
}
nav ul {
width: 100%;
display: block;
height: auto;
}
nav li {
width: 50%;
float: left;
position: relative;
}
nav li a {
border-bottom: 1px solid #576979;
border-right: 1px solid #576979;
}
nav a {
text-align: left;
width: 100%;
text-indent: 25px;
}
.icon{display: inline-block;}
}

/*Styles for screen 515px and lower*/
@media only screen and (max-width : 480px) {
nav {
border-bottom: 0;
}
nav ul {
display: none;
height: auto;
}
nav a#pull {
display: block;
background-color: #283744;
width: 100%;
position: relative;
}
nav a#pull:after {
content:"";
background-image:url(../immagini/nav-icon.png);
background-repeat:no-repeat;
width: 30px;
height: 30px;
display: inline-block;
position: absolute;
right: 15px;
top: 10px;
}
.icon{display: inline-block;}
}

/*Smartphone*/
@media only screen and (max-width : 320px) {
nav li {
display: block;
float: none;
width: 100%;
}
nav li a {
border-bottom: 1px solid #576979;
}
.icon{display: inline-block;}
}

/* FlexSlider Default Theme
*********************************/
.flexslider {
background: #fff;
position: relative;
zoom: 1;
}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}

/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */

.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */

.flex-caption {background:none; -ms-filterrogidXImageTransform.Microsoft.gradient(startColorstr=# 4C000000,endColorstr=#4C000000);
filterrogidXImageTransform.Microsoft.gradient(startColorstr=# 4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}

p.flex-caption a {color: #fff;}
p.flex-caption a:hover {color: #fff, text-decoration: none;}

/* Direction Nav */
.flex-direction-nav li a {
position: absolute;
right: -2%; /* 14px / 700px */
width: 41px; /* 29px / 700px */
height: 41px; /* 29px / 248px */
max-width: 29px;
max-height: 29px;
display: block;
background-color: #3AC3E0;
background-position: center center;
background-repeat: no-repeat;
cursor: pointer;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
z-index: 1000;
}

.flex-direction-nav li a:hover {background-color: #72D3E9;}

.flex-direction-nav li .next {
background-image: url(img/global/button-arrow.png);
background-position: 11px 7px;
top: 38.73239436619718%; /* 110px / 284px */
}

.flex-direction-nav li .prev {
background-image: url(img/global/button-back-arrow.png);
top: 51.05633802816901%; /* 145px / 284px */
}

.flex-direction-nav li .disabled {
opacity: .3;
filter:alpha(opacity=30);
cursor: default;
}

/* Control Nav */

.flex-control-nav {width: 100%; position: absolute; bottom: -35px; text-align: center;}
.flex-control-nav li {margin: 0 0 0 10px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 10px; height: 10px; display: block; background: url(img/flexslider/pagination-dots.png) no-repeat 0 0; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -10px;}
.flex-control-nav li a.active {background-position: 0 -20px; cursor: default;}