TYPO3-Testaccount
Testen Sie die aktuellste TYPO3-Version kostenlos und unverbindlich für einen Monat!

Jetzt testen!

Schulungen

jetzt buchen
Forum » TYPO3 CMS: Module, Erweiterungen und Applikationen » Extensions schreiben

Probleme mit der anzeige von Bildern


Autor Nachricht
Verfasst am: 05. 03. 2012 [12:56]
Dav88
Themenersteller
Dabei seit: 02.03.2012
Beiträge: 2
 Hallo alle Zusammen,

da ich die Extensions von Shadowbox und Fanybox installiert habe möchte ich jetzt das Bilder per Klick sich mit dem Effekt "lightbox" öffnen.

Hier mein Quellcode:

HTML
//Bilder-------------------------------------------------------				
			$sql_share_pic='SELECT * FROM `_picture` WHERE `deleted` =0 AND `hidden` =0';
		$res_share_pic=$GLOBALS['TYPO3_DB']->sql_query($sql_share_pic); 
		//Share-Items
		$anz_picture=0;
		while ($row_share_pic= $GLOBALS['TYPO3_DB']->sql_fetch_assoc($res_share_pic)){
			if($anz_picture%4 == 0){
				$content_picture.='
			<div class="media_element">
				<ul>';
			}
			$content_picture.='
					<li class="view view-tenth"><img src="fileadmin/dateien/Share-Idea/Picture/thumbnails/'.$row_share_pic[picture].'" alt="Bild" /><div class="mask"><a href="fileadmin/dateien/Share-Idea/Picture/'.$row_share_pic[picture].'" class="detail">Lorem ipsum dolor<cite>Max Mustermann, 15</cite></a></div></li>';
			if($anz_picture%4 == 3){
				$content_picture.='
				</ul>
			</div>';
			}
			$anz_picture++;
		}
 
		if($anz_picture%4 != 0){
		$content_picture.='
				</ul>
			</div>';
		}
 
	//----------------------------------------------------------------------------------------	
	//--------------------------         AUSGABE                ------------------------------	
	//----------------------------------------------------------------------------------------	
 
//Bilder-------------------------------------------------------			
$content.='		</div>
	</div>
	<div class="media-photo">
		<div class="fotografiere"><a href=""><span></span>Fotografiere deine Idee</a></div>
		<div class="nav_media_slider">
			<div class="prev_media_slider">&larr;</div>
			<div class="next_media_slider"> &rarr;</div>
		</div>
		<div class="media_slider_elements" style="width:'.(ceil($anz_picture/4)*400).'px">';
 
		$content.=$content_picture;	
 
 
 
	$content.='	
	</div>
</div>';
 
		return $this->pi_wrapInBaseClass($content);
	}
}
 
 
 
if (defined('TYPO3_MODE') && $TYPO3_CONF_VARS[TYPO3_MODE]['XCLASS']['ext/_share_idea/pi3/class.tx_shareidea_pi3.php'])	{
	include_once($TYPO3_CONF_VARS[TYPO3_MODE]['XCLASS']['ext/_share_idea/pi3/class.tx_shareidea_pi3.php']);
}
 
?>



Meine JS Header:


<script src="fileadmin/templates/js/jquery-1.7.1.min.js"></script>
<script src="fileadmin/templates/js/jquery-ui-1.8.16.custon.min.js"></script>

<script src="fileadmin/templates/js/jquery.easing.1.3.js"></script>
<script src="fileadmin/templates/js/jquery.scrollto.min.js"></script>
<script src="fileadmin/templates/js/jquery.mousewheel-3.0.4.pack.js"></script>
<script src="fileadmin/templates/js/jquery.fancybox-1.3.4.pack.js"></script>
<script src="fileadmin/templates/js/head.js"></script>
<script src="fileadmin/templates/js/swfobject.js"></script>
<script src="fileadmin/templates/js/load_flash.js"></script>

<script type="text/javascript" src="http://fast.fonts.com/jsapi/b40a02b3-05e1-4b9e-a71f-f1b65525b52b.js"></script>
<script src="fileadmin/templates/js/vendor/jquery.ui.widget.js"></script>
<script src="fileadmin/templates/js/jquery.iframe-transport.js"></script>
<script src="fileadmin/templates/js/jquery.fileupload.js"></script>
<script src="fileadmin/templates/js/iscroll.js"></script>
<script type="text/javascript" src="typo3temp/pmkshadowbox/base-de-DE-img/shadowbox.js"></script><link type="text/css" media="all" rel="stylesheet" href="typo3temp/pmkshadowbox/base-de-DE-img/shadowbox.css" /><script type="text/javascript">
/* <![CDATA[ */ function shadowBoxInit() {
Shadowbox.init({
animate: 1,
animateFade: 1,
animSequence: 'sync',
autoplayMovies: 1,
continuous: 0,
counterLimit: 10,
counterType: 'skip',
displayCounter: 1,
displayNav: 1,
enableKeys: 1,
fadeDuration: 0.1,
flashParams: {bgcolor:"#000000",allowfullscreen:"true"},
flashVars: {},
flashVersion: '9.0.0',
handleOversize: 'resize',
handleUnsupported: 'link',
initialHeight: 160,
initialWidth: 320,
modal: 0,
onChange: function() {},
onClose: function() {},
onFinish: function() {},
onOpen: function() {},
overlayColor: '#000000',
overlayOpacity: 0.7,
resizeDuration: 0.1,
showOverlay: 1,
showMovieControls: 1,
skipSetup: 0,
slideshowDelay: 0,
viewportPadding: 20,
preserveAspectWhileResizing: 1
});
}
Shadowbox.path = 'typo3temp/pmkshadowbox/base-de-DE-img/';shadowBoxInit();;/* ]]> */
</script>


Ich weißt das ich bei der verlinkung <a rel="shadowbox;title=Titel für Shadowbox".... reinstetzen muss. Aber wie soll ich das im Quellcode umsetzen?

Bin noch neu in Typo3!

Gruss Davis

[Dieser Beitrag wurde 1mal bearbeitet, zuletzt am 05.03.2012 um 13:02.]
Profil
Verfasst am: 05. 03. 2012 [13:16]
mrtyu
Dabei seit: 07.11.2009
Beiträge: 16
 Hi David,

wie wäre es mit:

PHP
...
$content_picture.='<li class="view view-tenth">
<a rel="lightbox" href="<img src="fileadmin/dateien/Share-Idea/Picture/thumbnails/'.$row_share_pic[picture].'" alt="Bild" />"
<img src="fileadmin/dateien/Share-Idea/Picture/thumbnails/'.$row_share_pic[picture].'" alt="Bild" />
</a>
<div class="mask"><a href="fileadmin/dateien/Share-Idea/Picture/'.$row_share_pic[picture].'" class="detail">Lorem ipsum dolor<cite>Max Mustermann, 15</cite></a></div></li>';
...



Viele Grüße
mrtyu
ProfilWWWSkype