miniA4kuser
Lounge-Member
Also ich habe jetzt mal den kompletten Code aus Beitrag #1 genommen und die Anpassungen wie in Beitrag #16 gemacht und es läuft:
PS: Das doppelte jQuery (V.1.4.3) habe ich mal rausgeschmissen.
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- look up maintemplate css -->
<link href="./Main-Theme/css/modules.css" rel="stylesheet" type="text/css" />
<link href="./Main-Theme/css/fullscreen.css" rel="stylesheet" type="text/css" />
<link href="./Main-Theme/css/home.css" rel="stylesheet" type="text/css" />
<link href="./Main-Theme/css/connect.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="./Main-Theme/css/expandcollapse.css" media="screen" />
<!-- look up maintemplate js -->
<script type="text/javascript" src="./Main-Theme/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="./Main-Theme/js/jquery.main.js"></script>
<script type="text/javascript" src="./Main-Theme/js/jquery.tabs.js"></script>
<script type="text/javascript" src="./Main-Theme/js/connect.js"></script>
<!--[if IE]>
<script type="text/javascript" src="./Main-Theme/js/ie.js"></script><![endif]-->
<!-- Color Thief 2.0 -->
<script src="09_javascript/color-thief.js"></script>
<!-- Color Thief 2.0 -->
<!-- supersized script 3.0 -->
<script src="09_javascript/effects.core.js"></script> <!-- supersized 3.0 -->
<script src="09_javascript/effects.slide.js"></script> <!-- supersized 3.0 -->
<script type="text/javascript" src="09_javascript/supersized.3.0.js"></script>
<script type="text/javascript" src="09_javascript/supersized.3.0.resizenowMod.js"></script>
<!-- supersized script 3.0 -->
<!-- supersized config -->
<!--
Supersized - Fullscreen Slideshow jQuery Plugin
Version : 3.0 !!! MODIFIED !!!
Site : www.buildinternet.com/project/supersized
Author : Sam Dunn
Company : One Mighty Roar (www.onemightyroar.com)
License : MIT License / GPL License
-->
<script type="text/javascript">
$(function(){
$.fn.supersized.options = {
startwidth: 1200,
startheight: 800,
vertical_center: 1,
slideshow: 1,
navigation: 0,
thumbnail_navigation: 0,
transition: 1, //0-None, 1-Fade, 2-slide top, 3-slide right, 4-slide bottom, 5-slide left
pause_hover: 0,
slide_counter: 1,
slide_captions: 1,
slide_interval: 3000,
slides : [
{image : '12_intro/news_juni13/intro10.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro07.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro03.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro09.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro02.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro05.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro01.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro04.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro08.jpg', title : 'xxx', url: 'news.html' },
{image : '12_intro/news_juni13/intro06.jpg', title : 'xxx', url: 'news.html' }
],
callback: function () {
//Get current image
var currentimage = $('#supersized .activeslide').find('img')[0];
//Initialize color thief
var colorThief = new ColorThief();
//Run Color Thief function and get image colors
var color = colorThief.getColor(currentimage);
//Set background color
$('#nav').css('background-color', 'rgb(' + color[0] + ',' + color[1] + ',' + color[2] + ')');
}
};
$('#supersized').supersized();
});
</script>
<style type="text/css">
/* supersize plugin styles */
body { overflow: hidden; }
#loading {
position: absolute;
top: 49.5%;
left: 49.5%;
z-index: 10;
width: 70px;
height: 20px;
text-indent: -999em;
background-image: url(08_grafik/progress2.gif);
}
#supersized{ position: fixed; }
#supersized img{ -ms-interpolation-mode: bicubic; }
#supersized img, #supersized a {
height: 100%;
width: 100%;
position: absolute;
z-index: -1;
}
#supersized .prevslide, #supersized .prevslide img { z-index: 1; }
#supersized .activeslide, #supersized .activeslide img { z-index: 2;}
</style>
<!-- supersized config -->
</head>
<body class="template-homepage_html template-homepage_html portaltype-agencypage site section-index icons-on" oncontextmenu="return false">
<!-- preload background -->
<div id="preload">
<img src="08_grafik/logo_index.png" alt="preload" />
<img src="08_grafik/progress.gif" alt="preload" />
<img src="01_news/news_adac.jpg" alt="preload" />
<img src="01_news/news_quattro2.jpg" alt="preload" />
<img src="01_news/news_lemans.jpg" alt="preload" />
<img src="01_news/news_audi_rs6.jpg" alt="preload" />
<img src="01_news/audi_mexico.jpg" alt="preload" />
<img src="02_agentur/agentur_objektiv.jpg" alt="preload" />
<img src="03_best_practice/bp_fischer.jpg" alt="preload" />
<img src="05_kontakt/postkasten.jpg" alt="preload" />
</div>
<!-- inhalte der webseite //-->
<div>
<noscript>Javascript must be enabled for the correct page display</noscript>
<div id="wrapper">
<header id="header">
<div class="header-holder">
<a class="skip" accesskey="S" href="#main-content">zum Inhalt</a>
<span class="bg-globe"></span>
<div class="header-panel">
<hgroup>
<h1 class="logo"><a href="./"><img src="" alt=""><span> Logo </span></a></h1>
<h2 class="work-text"> </h2>
</hgroup>
<div class="search-form">
<!-- TOP-THEMA START //-->
<div class="row">
<div class="add-nav">
<ul>
<li><a title="#" class="active" href="./">Aktuell</a></li>
<li><a title="" href="./archiv">Archiv</a></li>
<li><a title="" href="./kontakt">Kontakt</a></li>
</ul>
</div>
</div>
<!-- TOP-THEMA END //-->
<div class="row">
<!-- SEACH START //-->
<form id="suche">
<fieldset>
<div1> </div1>
<script>
(function() {
var cx = '007610723754450814993:kqfhugdiwy0';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:search></gcse:search>
<div2> </div2>
</fieldset>
</form>
</div>
<!-- Langauage-Selction START //-->
<div class="row">
<ul class="lang-list">
<li lang="1" xml:lang="1"><a title="English" href="./en/index">English</a></li>
<!-- <li lang="2" xml:lang="2"><a title="Lang 2" href="./">Lang 2</a></li>
<li lang="3" xml:lang="3"><a title="Lang 3" href="./">Lang 3</a></li>
<li lang="4" xml:lang="4"><a title="Lang 4" href="./">Lang 4</a></li>
<li lang="5" xml:lang="5"><a title="Lang 5" href="./">Lang 5</a></li>
<li lang="6" xml:lang="6"><a title="Lang 6" href="./">Lang 6</a></li> //-->
<li><a title="More Languages" alt="More Languages" class="more" href="./languages">More<span class="visuallyhidden"> Languages</span></a></li>
</ul><br/>
</div>
<!-- Langauage-Selction END //-->
</div>
</div>
<!-- Iframe for slider2 START //-->
<iframe src="picslide2.html" style="border:0px none;" name="pictureslider" scrolling="no" frameborder="0" align="middle" marginheight="0px" marginwidth="0px" height="220" width="974"></iframe>
<!-- Iframe for slider2 ENDE //-->
<!-- NAVIGATION START //-->
<nav id="nav">
<h3 class="visuallyhidden">Navigation</h3>
<!-- Main-Entrys of Navigation //-->
<ul>
<!-- Main-Entry 1 //-->
<li class="active"><a title="Start" href="#" class=""<span>Start</span></a><span class="arrow"></span></li>
<!-- Main-Entry 2 //-->
<li class=""><a title="Portfolio" href="./portfolio" class="hasChildrens"><span>Portfolio</span></a>
<!-- Sub-Entrys of Main-Entry 2 //-->
<div class="drop">
<ul class="globalSectionsLevel1 show-static">
<li class="plain "><a title="Themenreihen & Kurse" href="./themen_kurse_m2" class=""><span>Themenreihen & Kurse</span></a></li>
<li class="plain "><a title="Veröffentlichungen" href="./publikationen_m3" class=""><span>Veröffentlichungen</span></a></li>
<li class="plain "><a title="Arbeitsblätter & Mehr" href="./arbeitsmatherial_m5" class=""><span>Arbeitsblätter & Mehr</span></a></li>
<li class="plain "><a title="" href="./" class=""><span> </span></a></li>
</ul>
<!-- Mini-Menu into the Sub-Entrys of Main-Entry 2 //-->
<div class="static"><img title="" alt="" src="./Main-Theme/images/portfolio-1024x493.jpg" width="154" height="119" class="image-inline"><h4><a href="./"> </a></h4>
<p> <a href="./"> </a></p>
<p> <a href="./"> </a></p>
</div>
<div class="static"><img title="" alt="" src="" class="image-inline"><h4><a href="./"> </a></h4>
<p> <a href="./"> </a> </p>
<p> <a href="./"> </a> </p>
</div>
<div class="visualClear"><!-- -->
</div>
</div>
</li>
</nav>
<!-- NAVIGATION END //-->
</div>
</header>
<!-- HAUPTINHALT START //-->
[...]
<!-- loading display while images load -->
<div id="loading"> </div>
<!-- slides -->
<div id="supersized"></div>
</body>
</html>PS: Das doppelte jQuery (V.1.4.3) habe ich mal rausgeschmissen.
