Naja es gibt schon Bildslider wo auch das Video mit wie ein Bild geslidet wird,
wegen Style Maße von Multimedia Box, man kann es auch Responsive erstellen so das es sich Automatisch an die Maße anpasst,
..und der Name sagt schon eigentlich alles, Multimedia Box, also es wird gezielt für bestimmte Zwecke eingesetzt, bei mir ist es Info Video, Live-stream von YouTube, und etwas Werbung,
Das ganze wirkt wie ein Info-Pinnwand
weil die Info wand ständig Aktualisiert wird ist es sinnvoller über eine Grafische oberflächliche im AC zu Bedienen.
Hier noch eine Möglichkeit.
Globales Template erstellen mit folgenden Namen
multimedia_box
Inhalt:
Code:
<script type="text/javascript">
jQuery(document).ready(function() {
$(".video").click(function() {
$.fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'title' : this.title,
'width' : 640,
'height' : 385,
'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
'type' : 'swf',
'swf' : {
'wmode' : 'transparent',
'allowfullscreen' : 'true'
}
});
return false;
});
});
</script>
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<thead>
<tr>
<td class="thead" colspan="2"><strong>Multimedia Box</strong></td>
</tr>
</thead>
<tbody>
<tr>
<td width="50%" class="trow1" valign="top">
<div style="width:100%">
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/sVkODVL6PRM?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/sVkODVL6PRM/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/I4tFNfROlqk?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/I4tFNfROlqk/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/k5LY2VB3d2Q?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/k5LY2VB3d2Q/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/rOaw15p9Czo?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/rOaw15p9Czo/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/NgyXy89Rxa0?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/NgyXy89Rxa0/hqdefault.jpg" style="width:100%" alt="" /></a></div>
</div>
<div style="width:100%">
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/vDCdEHXaDqs?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/vDCdEHXaDqs/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/oxq2FYKz3vE?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/oxq2FYKz3vE/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/ITOEqXBRMW4?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/ITOEqXBRMW4/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/s9ZbCMHzc6M?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/s9ZbCMHzc6M/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/ewG8ql8RJM0?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/ewG8ql8RJM0/hqdefault.jpg" style="width:100%" alt="" /></a></div>
</div>
<div style="width:100%">
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/fA1fzeH4-08?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/fA1fzeH4-08/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/FgcQpy0Rnr4?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/FgcQpy0Rnr4/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/w3i18Jg0mgg?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/w3i18Jg0mgg/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/MDoiOIp2TlI?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/MDoiOIp2TlI/hqdefault.jpg" style="width:100%" alt="" /></a></div>
<div style="width:19%;float:left;padding:0;margin:0;border:0;"><a class="video" href="http://www.youtube.com/v/w2EmDtXcYH4?fs=1&autoplay=1"><img src="https://i.ytimg.com/vi/w2EmDtXcYH4/hqdefault.jpg" style="width:100%" alt="" /></a></div>
</div>
</td>
<td width="50%" class="trow1" valign="top">
<div id="banner" style="width:100%;">
<div class="item active"><img src="https://s-media-cache-ak0.pinimg.com/736x/eb/af/b9/ebafb95dfc67635a3314580bbdb43816.jpg" border="0" style="width:100%;" height="315" /></div>
<div class="item special">
<div class="content">
<h1>Slide title</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec sapien nunc. Proin aliquet imperdiet felis id semper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque purus tellus, iaculis id iaculis vel, tincidunt non lectus.</p>
<p>Vivamus a massa est. Nunc nulla mauris, interdum at hendrerit eget, condimentum ut orci. Pellentesque id congue eros. Suspendisse convallis nibh non lacus molestie adipiscing. Nunc vel dolor sed sem dictum tristique id quis magna. Etiam eu est nec arcu tristique fermentum.</p>
</div>
</div>
<div class="item"><img src="http://localhost/50/images/logo.png" border="0" style="width:100%;" height="315" /></div>
<div class="item"><img src="http://images.china.cn/attachement/jpg/site1003/20141031/7427ea210a2a15bd6d8001.jpg" border="0" style="width:100%;" height="315" /></div>
</div>
</td>
</tr>
</tbody>
</table><br />
<script type="text/javascript">
$(document).ready(function() {
$('#banner').slideshow();
});
</script>
Template "
headerinclude" öffnen und an letzter Stelle dies einfügen
Code:
<!-- Video -->
<link rel="stylesheet" href="fancybox/style.css" />
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<!-- Video und Slider-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<!-- Video -->
<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="fancybox/video.js"></script>
<!-- Slider -->
<script src="slider/jquery.slideshow.advanced.js" type="text/javascript"></script>
Eine neue css Datei im ACP erstellen.
Name:
multimedia-box.css
Inhalt:
Code:
#banner {
margin: 0;
padding: 0;
width: 100%;
height: 315px;
overflow: hidden;
position: relative;
left: 0;
}
#banner .item {
position: absolute;
width: 100%;
height: 315px;
background-color: #fefefe;
}
#banner .active {
z-index: 7;
}
#banner .last-active {
z-index: 6;
}
#banner .navigation {
position: absolute;
bottom: 0;
margin: 0;
list-style: none;
z-index: 8;
padding: 0;
}
#banner .navigation li {
float: left;
width: 10px;
height: 10px;
background: black;
margin-left: 5px;
cursor: pointer;
}
#banner .navigation li.active {
background: red;
}
#banner .special {
background: #eee;
}
#banner .content {
padding: 20px;
text-align: center;
}
Anhang laden und entpacken, und in das MyBB Hauptverzeichnis kopieren.
So sollte es am Ende aussehen.
[
attachment=11478]
man erkennt nicht viel und du hast nicht viel geschrieben, ist das Bild oder Video? kannst du noch einen einen Screenshot ohne popup machen.
Danke ,sieht sehr gut aus
also links sind Videos und rechts Bilder Slider richtig?
werde es morgen testen Danke sehr
@MrBrechreiz
Zitat:Template "headerinclude" öffnen und an letzter Stelle dies einfügen
Bin gerade dabei, aber wo ist headerinclude?
EDIT: ok hat sich erledigt