ilch Forum » Ilch Clan 1.1 » Module und Modifikationen » Fancybox im BB-Code / Forum

Geschlossen
  1. #31
    User Pic
    CaZper Mitglied
    Registriert seit
    03.01.2011
    Beiträge
    17
    Beitragswertungen
    0 Beitragspunkte
    HI ! lächeln

    DANKE AN ALLE !!!!!!!! ALLES GELÖST !!!!!!!!!!!!!

    <table id="galimages" class="border" border="0" cellspacing="1" cellpadding="0">
    <tr>
    <td></a><a rel="galimagesrel" href=" BILD URL "> NAME DES LINKS </a></td> 
    </tr>
    </table>


    Hab es so gelöst und es funktioniert lächeln


    <div id="dieoase"><map name="Map"><area shape="rect" coords="28,245,110,283" href="http://anja-berger.de/garten/include/images/gallery/img_norm_1.jpg" alt="klostergarten"></map>



    Wie bekomme ich den link per Fancy geöffnet?

    In der Index gibt es diesen Code... aber einfach mal auf "dieoase" anpassen bringt leider nichts.. lachen

    $(document).ready(function() {
    		$("table#galimages a").fancybox(
    		{ 
    		'zoomSpeedIn': 800, 
    		'zoomSpeedOut': 500, 
    		'zoomSpeedChange': 800,
    		'zoomOpacity': 0.5,
    		'overlayOpacity': 0.5,
    		'easingIn' : 'easeOutBack',
    		'easingOut'	: 'easeInBack',
    		'overlayShow': true
    		}
    		);
    		
    		$("div#dieoase a").fancybox(
    			{ 
    		'zoomSpeedIn': 800, 
    		'zoomSpeedOut': 500, 
    		'zoomSpeedChange': 800,
    		'zoomOpacity': 0.5,
    		'overlayOpacity': 0.5,
    		'easingIn' : 'easeOutBack',
    		'easingOut'	: 'easeInBack',
    		'overlayShow': true
    		}
    		);
    	});




    DAS WÄRE JA SO TOLL, wenn das noch klappt lächeln


    Zuletzt modifiziert von CaZper am 22.01.2011 - 03:34:04
    kann dochmal passieren lachen
    0 Mitglieder finden den Beitrag gut.
  2. #32
    User Pic
    CaZper Mitglied
    Registriert seit
    03.01.2011
    Beiträge
    17
    Beitragswertungen
    0 Beitragspunkte
    RÄTSELS LÖSUNG !!!!!!!!!!!! lachen

    In der INDEX !



    $(document).ready(function() {

    $(" id des links divs oder tabelle ").fancybox();
    kann dochmal passieren lachen
    0 Mitglieder finden den Beitrag gut.
  3. #33
    User Pic
    Elsterglanz Mitglied
    Registriert seit
    24.02.2013
    Beiträge
    31
    Beitragswertungen
    3 Beitragspunkte
    Hallo zusammen!

    Also ich habe nun alle Threads durchgelesen und alles mögliche ausprobiert, aber irgendwie will die Fancybox nicht so wie ich^^

    Hochgeladen habe ich alles. Meine Dateien sehen wie folgt aus:

    Index htm des Designs

    <!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">
    <!-- Maretz.eu - Free Ilch Clan and CommUnity Templates -->
    <head><meta http-equiv="content-type" content="text/html;charset=ISO-8859-1" />
    <style type="text/css">
    .black_overlay{
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
    }
    .white_content {
    display: none;
    position: fixed;
    top: 10%;
    left: 40%;
    width: 300px;
    height: 400px;
    padding: 3px;
    background-color: #ffffff;
    border: 2px solid #000000;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    color: #2f2f2f;
    z-index:1002;
    overflow: auto;
    }
    </style>
    <link rel="stylesheet" type="text/css" href="include/extras/fancybox/jquery.fancybox.css" media="screen" />
      <script type="text/javascript" src="include/includes/js/jquery-1.3.2.min.js"></script>  
      <script type="text/javascript" src="include/extras/fancybox/jquery.fancybox-1.2.1.pack.js"></script> 
      <script type="text/javascript" src="include/extras/fancybox/jquery.easing.1.3.js"></script>
      <script type="text/javascript">
    	$(document).ready(function() {
    		$("table#galimages a").fancybox(
    		{ 
    		'zoomSpeedIn': 800, 
    		'zoomSpeedOut': 500, 
    		'zoomSpeedChange': 800,
    		'zoomOpacity': 0.5,
    		'overlayOpacity': 0.5,
    		'easingIn' : 'easeOutBack',
    		'easingOut'	: 'easeInBack',
    		'overlayShow': true
    		}
    		);
    		
    		$("div#bbvideo a").fancybox(
    		{ 
    		'zoomSpeedIn': 800, 
    		'zoomSpeedOut': 500, 
    		'zoomSpeedChange': 800,
    		'zoomOpacity': 0.5,
    		'overlayOpacity': 0.5,
    		'overlayShow': true
    		}
    		);
    	});
       </script>
    <link rel="SHORTCUT ICON" href="include/images/favicon.ico" />
    <title>{TITLE}</title>
    <link rel="stylesheet" href="include/designs/mar_Elite/style_elite.css" type="text/css" title="mar_Elite" media="screen, projection" />
    <link href="include/designs/mar_Elite/dropdown.vertical.css" media="screen" rel="stylesheet" type="text/css" />
    <link href="include/designs/mar_Elite/default.css" media="screen" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="include/designs/mar_Elite/boxswitch/tabcontent.js">
    /***********************************************
    * Tab Content script v2.2 and Mouseover Tabs Menu- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
    ***********************************************/
    </script>
    </head><body>
    <script type="text/javascript" src="snowflakes.js"></script> 
    
    <div id="ts_pop" style="margin-left:520px;left:50%;position:absolute;top:234px;" >
    <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">
    <img src="include/images/icons/ts_logo.png" border="0" alt="Teamspeak" onmouseover="this.src='include/images/icons/ts_logo_h.png';" onmouseout="this.src='include/images/icons/ts_logo.png'" border="0"/></a></div>
    
    <div href="https://www.facebook.com/legrafikcommunity" style="margin-left:520px;left:50%;position:absolute;top:336px;" >
    <a href = "https://www.facebook.com/legrafikcommunity" target="_blank">
    <img src="include/images/icons/fb.png" border="0" alt="Teamspeak" onmouseover="this.src='include/images/icons/fb_h.png';" onmouseout="this.src='include/images/icons/fb.png'" border="0"/></a></div>
    
    <!-- Vorsicht bei Änderungen!Dies kann zu Fehldarstellungen führen. -->
    <div id="seite"><a name="anfang" id="anfang"></a>
    <div id="header"></div>
    <div id="social_icons"><div id="social_icons_platz"><a class="ts" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'"" title=" Teamspeak"></a><a class="server"  href = "javascript:void(0)" onclick = "document.getElementById('light1').style.display='block';document.getElementById('fade1').style.display='block'"" title="GameServer"></a><a class="facebook" href="http://www.facebook.com/Maretz.eu" title="Besucht uns auf facebook" target="_blank"></a></div></div>
    <div id="navigation"><div id="navigation_platz">{_boxes_top_navigation_elite}</div></div>
    <div id="infobox"><div id="one">
    <div id="navigation_info"><ul id="countrytabs1" class="shadetabs">
    <li><a href="#" rel="platz_box1" class="selected" title="User Forum">User Forum</a></li>
    <li><a href="#" rel="platz_box2" title="letzte News">Last News</a></li>
    <li><a href="#" rel="platz_box3" title="Forumeinträge mit den meisten Antworten">Most Responded</a></li>
    <li><a href="#" rel="platz_box4" title="New Downloads">New Downloads</a></li></ul></div>
    <div id="inhalt_info">
    <div id="platz_box1" class="tabcontent">{_boxes_lastforum_elite}</div>
    <div id="platz_box2" class="tabcontent">{_boxes_lastnews_elite}</div>
    <div id="platz_box3" class="tabcontent">{_boxes_toptopic_elite}</div>
    <div id="platz_box4" class="tabcontent">{_boxes_download}</div>
    <script type="text/javascript">
    var countries=new ddtabcontent("countrytabs1")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    </script></div>
    <div id="login_user">{_boxes_login_elite}</div></div></div><div id="abstand_one"></div>
    <br style="clear: both;"/><div id="content-bg"><div id="left_col">
    {_list_menunr1@<div id="menu_heading_left" ><div id="menu_heading_left_font">%1</div></div><div id="menuleftmiddle" class="menuone">%2</div><div id="menuleftbottom"></div>}</div>
    <div id="right_col"></div>
    <div id="head_content"><div class="hmenustyle_ov">{HMENU}</div></div><div id="main_col"><div id="main_colin">{EXPLODE}</div><div id="foot_content"></div></div>
    <br style="clear: both;" />
    <div id="footer">{_boxes_allianzelite}<br/><span class="foot_font"><a class="foot_font_a" href="index.php?impressum">All Rights by {SITENAME}</a> | <a class="foot_font_a" href="http://www.maretz.eu" target="_blank">Design by Maretz.eu</a> | <a class="foot_font_a" href="http://www.ilch.de" target="_blank">CMS by Ilch.de</a></span><a class="nach_oben" href="#anfang" title="Top Page"></a></div>
    <div id="end_platz"></div>
    </div></div>
    <div id="light" class="white_content"><a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'" class="closed" title="Fenster schließen"></a><br/><br/>
    <!-- Anfang TS Code -->
    <div id="ts3viewer_1015265" style="width:; background-color:;"> </div>
    
    <script type="text/javascript" src="http://static.tsviewer.com/short_expire/js/ts3viewer_loader.js"></script>
    
    <script type="text/javascript">
    <!--
    var ts3v_url_1 = "http://www.tsviewer.com/ts3viewer.php?ID=1015265&text=000000&text_size=12&text_family=1&js=1&text_s_color=ff0000&text_s_weight=bold&text_s_style=normal&text_s_variant=normal&text_s_decoration=none&text_s_color_h=525284&text_s_weight_h=bold&text_s_style_h=normal&text_s_variant_h=normal&text_s_decoration_h=underline&text_i_weight=normal&text_i_style=normal&text_i_variant=normal&text_i_decoration=none&text_i_color_h=525284&text_i_weight_h=normal&text_i_style_h=normal&text_i_variant_h=normal&text_i_decoration_h=underline&text_c_weight=normal&text_c_style=normal&text_c_variant=normal&text_c_decoration=none&text_c_color_h=525284&text_c_weight_h=normal&text_c_style_h=normal&text_c_variant_h=normal&text_c_decoration_h=underline&text_u_color=459cff&text_u_weight=bold&text_u_style=normal&text_u_variant=normal&text_u_decoration=none&text_u_color_h=525284&text_u_weight_h=bold&text_u_style_h=normal&text_u_variant_h=normal&text_u_decoration_h=none";
    ts3v_display.init(ts3v_url_1, 1015265, 100);
    -->
    </script>
    <!-- Ende TS Code -->
    </div><div id="fade" class="black_overlay"></div>
    <div id="light1" class="white_content1"><a href = "javascript:void(0)" onclick = "document.getElementById('light1').style.display='none';document.getElementById('fade1').style.display='none'" class="closed" title="Fenster schließen"></a><br/><br/>
    <!-- Anfang Gamserver Code -->
    {_boxes_gameserver}
    <!-- Ende Gameserver Code -->
    </div><div id="fade1" class="black_overlay1"></div>
    </div></div>
    <div id="light" class="white_content"><a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'"><br>Close<br><br></a>
    <!-- Anfang TS Code -->
    HIER TS CODE REIN
    <!-- Ende TS Code -->
    <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'"><br>Close</a></div>
    <div id="fade" class="black_overlay"></div>
    </body></html>
    <!-- {__list_hmenupoint@<a %1 class="menu" href="%2">%3</a><br>}
    {_list_hmenupoint@<a target="%1" class="menu" href="%2">%3</a>|</li>|<br />}
    {_list_hmenubegi@}
    {_list_hmenuende@}
    {_list_vmenupoint@<a target="%1" class="menu" title="%3" href="%2">%3</a><br/>}
    {_list_vmenubegi@}
    {_list_vmenuende@}//-->


    BBcode Global.js

    function addEvent(elm, evType, fn, useCapture)
    // addEvent and removeEvent
    // cross-browser event handling for IE5+,  NS6 and Mozilla
    // By Scott Andrew
    {
     if (elm.addEventListener){
       elm.addEventListener(evType, fn, useCapture);
       return true;
     } else if (elm.attachEvent){
       var r = elm.attachEvent("on"+evType, fn);
       return r;
     } else {
       alert("Handler could not be removed");
     }
    }
    
    addEvent(window, "load", ResizeBBCodeImages);
    
    //Funktion die alle Bilder des BBCodes der Funktion SetSize übergibt
    function ResizeBBCodeImages() {
      imgs = document.getElementsByTagName("img");
      for (ti=0;ti<imgs.length;ti++) {
        if (imgs[ti].className.indexOf("bbcode_image") != -1) {
          SetSize(imgs[ti]);
        }
      }
    }
    
    //Funktion zum Ändern der Bildgröße für zu große Bilder
    function SetSize(img){
      var w = img.width;
      var h = img.height;
      var toChange = false;
      if (w>bbcodemaximagewidth) {
        h = bbcodemaximagewidth * h / w;
        w = bbcodemaximagewidth;
        toChange = true;
        }
      if (h>bbcodemaximageheight) {
        w = bbcodemaximageheight * w / h;
        h = bbcodemaximageheight;
        toChange = true;
        }
      if (toChange) {
        var src = img.getAttribute('src');
        if ( img.parentNode.nodeName.toLowerCase() == 'a' ) {
          img.setAttribute('width',w);
          img.setAttribute('height',h);
        } else {
          var ersatz = document.createElement('a');
          ersatz.setAttribute('href',src);
          var newImg = document.createElement('img');
          newImg.setAttribute('src',src);
          newImg.setAttribute('width',w);
          newImg.setAttribute('height',h);
          newImg.setAttribute('border','0');
          newImg.setAttribute('style',img.getAttribute('style',0));
          ersatz.appendChild(newImg);
          img.parentNode.replaceChild(ersatz,img);
          $(ersatz).fancybox();
        }
      }
    }
    
    //Funktion für BBCode Klapptext
    function Klapptext(str) {
    	var KlappText = document.getElementById('layer_'+str);
    	var KlappBild = document.getElementById('image_'+str);
    	var medientuner_minus= "include/images/icons/minus.gif", medientuner_plus="include/images/icons/plus.gif";
    	
    	if (KlappText.style.display == 'none') {
    		KlappText.style.display = 'block';
    		KlappBild.src = medientuner_minus;
    	} else {
    		KlappText.style.display = 'none';
    		KlappBild.src = medientuner_plus;
    	}
    }


    Ich bräuchte die Funktion der Fancybox nur bei den News und im Forum.
    Danke schon mal im Vorraus!
    0 Mitglieder finden den Beitrag gut.
  4. #34
    User Pic
    Jens238 Mitglied
    Registriert seit
    20.03.2013
    Beiträge
    404
    Beitragswertungen
    44 Beitragspunkte
    Du hast ja das IlchBB 3.1 drauf, das läd in der load_extensions.htm auch
    nochmal jquery...
    Nimm das mal aus der load_extensions raus...

    Edit:

    Ach ja, hier mal das betreffende Stück aus meine BBCodeGlobal.js

    //Funktion die alle Bilder des BBCodes der Funktion SetSize übergibt
    function ResizeBBCodeImages() {
      imgs = document.getElementsByTagName("img");
      for (ti=0;ti<imgs.length;ti++) {
        if (imgs[ti].className.indexOf("bbcode_image") != -1) {
          SetSize(imgs[ti]);
        }
      }
      new shadowbox();
    }
    
    //Funktion zum Ändern der Bildgröße für zu große Bilder
    function SetSize(img){
      var w = img.width;
      var h = img.height;
      var toChange = false;
      if (w>bbcodemaximagewidth) {
        h = bbcodemaximagewidth * h / w;
        w = bbcodemaximagewidth;
        toChange = true;
        }
      if (h>bbcodemaximageheight) {
        w = bbcodemaximageheight * w / h;
        h = bbcodemaximageheight;
        toChange = true;
        }
      if (toChange) {
        var src = img.getAttribute('src');
        if ( img.parentNode.nodeName.toLowerCase() == 'a' ) {
          img.setAttribute('width',w);
          img.setAttribute('height',h);
        } else {
          var ersatz = document.createElement('a');
          ersatz.setAttribute('href',src);
          ersatz.setAttribute('target','_blank');
          ersatz.setAttribute('rel','shadowbox');
          var newImg = document.createElement('img');
          newImg.setAttribute('src',src);
          newImg.setAttribute('width',w);
          newImg.setAttribute('height',h);
          newImg.setAttribute('border','0');
          newImg.setAttribute('style',img.getAttribute('style',0));
          ersatz.appendChild(newImg);
          img.parentNode.replaceChild(ersatz,img);
        }
      }
    }



    Zuletzt modifiziert von Jens238 am 27.12.2013 - 20:53:58
    0 Mitglieder finden den Beitrag gut.
  5. #35
    User Pic
    Elsterglanz Mitglied
    Registriert seit
    24.02.2013
    Beiträge
    31
    Beitragswertungen
    3 Beitragspunkte
    Hi Jens....mein Namensvetter zwinker

    Danke für deine Antwort. Leider nichts gebracht. Irgendwas kann doch da net stimmen. traurig
    0 Mitglieder finden den Beitrag gut.
  6. #36
    User Pic
    Jens238 Mitglied
    Registriert seit
    20.03.2013
    Beiträge
    404
    Beitragswertungen
    44 Beitragspunkte
    Man bin ich blöd schockiert

    Sehe ich ja jetzt erst... Die Fancybox sucht ja nach einer ID nicht nach dem rel=Tag.
    Ein link für die Fancybox sollte also so aussehen:
    <a id="imageID" href="link zum Bild bla bla bla" target="_blank" <img src="link zum Bild bla bla bla">

    Man müsste dem BBCode jetzt beibringen, das er hinter das a eine ID setzt.
    Dann sollte es eigentlich funktionieren.
    Kann man der Fancybox auch sagen, das sie nach dem rel=Tag suchen soll ?
    Oder Du gehst den einfacheren Weg und nutzt ein Lightbox, die nach dem rel=Tag sucht zwinker


    Zuletzt modifiziert von Jens238 am 28.12.2013 - 10:29:35
    0 Mitglieder finden den Beitrag gut.
  7. #37
    User Pic
    Elsterglanz Mitglied
    Registriert seit
    24.02.2013
    Beiträge
    31
    Beitragswertungen
    3 Beitragspunkte
    Kannst du mir eine Lightbox empfehlen und evtl den Einbau mit mir zusammen machen über TS oder Teamviewer etc. Bin noch nicht so fit mit dem Kram aber lerne gerne dazu.

    Gruss
    0 Mitglieder finden den Beitrag gut.
  8. #38
    User Pic
    Jens238 Mitglied
    Registriert seit
    20.03.2013
    Beiträge
    404
    Beitragswertungen
    44 Beitragspunkte
    Ich bin ja begeistert von der Shadowbox ( externer Link ).
    Skaliert super mit der Bildschirmauflösung und kann auch alles anzeigen,
    von Bildern über Videos bis hin zu ganzen Websites.
    In meinen Admin Bereich verwende ich die um das Admin Center meines
    Leaderboards zu öffnen zunge

    Einabauen ist recht simpel, Du brauchst in Deiner index nur die folgenden
    Codes einzubauen...

    <link rel="stylesheet" href="/include/includes/js/shadowbox/shadowbox.css" type="text/css" media="screen" />
    
    <script type="text/javascript" src="include/includes/js/shadowbox/shadowbox.js"></script>
        <script type="text/javascript">window.onload = function(){ Shadowbox.init({continuous: true})};</script>


    Und halt die funktion aus meiner BBCodeGlobal.js... (siehe oben)
    Die fügt dann den rel="shadowbox" Tag den Bilder hinzu.

    Was zu Problemen führt ist, wenn in der load_extensions.htm vom
    IlchBB 3.1 nochmal jquery geladen wird... Das solltest Du auf jeden Fall
    raus nehmen.

    Die Shadowbox in Aktion kannste Dir ja auf meiner Seite schonmal anschauen:

    externer Link

    Wenn Du Probleme beim einbauen hast, kannste gerne mal bei uns im TS vorbei schauen. Im TS heiss ich LordOfDeath99, bin immer so ab 21:00 Uhr online...
    0 Mitglieder finden den Beitrag gut.
  9. #39
    User Pic
    Elsterglanz Mitglied
    Registriert seit
    24.02.2013
    Beiträge
    31
    Beitragswertungen
    3 Beitragspunkte
    Ok Danke für deine Hilfe....ich versuche es erstmal selbst, bei Problemen werd ich dann bei dir im TS vorbei schauen. zwinker

    Gruss
    0 Mitglieder finden den Beitrag gut.
  10. #40
    User Pic
    Jens238 Mitglied
    Registriert seit
    20.03.2013
    Beiträge
    404
    Beitragswertungen
    44 Beitragspunkte
    Kein Problem...

    Wenn ich das geschafft habe, schaffst Du das auch zwinker
    0 Mitglieder finden den Beitrag gut.
  11. #41
    User Pic
    Elsterglanz Mitglied
    Registriert seit
    24.02.2013
    Beiträge
    31
    Beitragswertungen
    3 Beitragspunkte
    Habs versucht aber irgendwas übersehe ich....komme dann mal im Ts vorbei wenn du da bist
    0 Mitglieder finden den Beitrag gut.
  12. #42
    User Pic
    Jens238 Mitglied
    Registriert seit
    20.03.2013
    Beiträge
    404
    Beitragswertungen
    44 Beitragspunkte
    Mach das, brauche aber noch ein wenig...
    Meine Soundkarte weigert sich gerade ein wenig Ton auszugeben grumml
    0 Mitglieder finden den Beitrag gut.
  13. #43
    User Pic
    FightClub Mitglied
    Registriert seit
    02.06.2013
    Beiträge
    196
    Beitragswertungen
    1 Beitragspunkte
    ZitatZitat geschrieben von Mairu
    Ein Link zur Seite wäre nicht verkehrt, wenn ich raten soll, hast du vielleicht BBCode 2.0 und da werden die Bilder auch verkleinert, und dabei werden sie unter Umständen ersetzt und die Fancybox bekommt keinen Zugriff.


    Und genau das habe ich,

    bekomme die Fancybox nicht auf.

    Wenn ich Screenshot einfüge

    Das habe ich eingebunden:
    in der include/inlcudes/class/bbcode.php
    $image = '<a rel="galimagesrel" href="'.$string.'"><img src="'.$string.'" alt="" title="" border="0" width="'.$this->info['ScreenMaxBreite'].'" height="'.$this->info['ScreenMaxHoehe'].'" '.$float.'/></a>';


    Versucht habe ich es mit:
    id="galimages" 
    id="fancy_img" 
    rel="galimagesrel"


    Meine Beta HP: externer Link

    MFG BennY zwinker


    Zuletzt modifiziert von FightClub am 05.03.2014 - 22:05:30
    0 Mitglieder finden den Beitrag gut.
  14. #44
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Stimmt so schon, natürlich muss noch das Javascript da sein, welches dann die Fancybox o.ä. initialisiert.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  15. #45
    User Pic
    FightClub Mitglied
    Registriert seit
    02.06.2013
    Beiträge
    196
    Beitragswertungen
    1 Beitragspunkte
    ZitatZitat geschrieben von Mairu
    Stimmt so schon, natürlich muss noch das Javascript da sein, welches dann die Fancybox o.ä. initialisiert.


    Hi Mairu, lachen

    Das ist meine index.htm mit Javascript.
    <head>
    	<title>{TITLE}</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    	<link rel="stylesheet" type="text/css" href="include/designs/ilchCMS/style.css">
    	
    		<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
    
        <link rel="stylesheet" type="text/css" href="include/includes/js/fancybox/jquery.fancybox.css" media="screen" />
    		<script type="text/javascript" src="include/includes/js/fancybox/jquery.fancybox.js"></script> 
    		<script type="text/javascript" src="include/includes/js/fancybox/extras/jquery.easing.1.3.js"></script>
    		<script type="text/javascript" src="include/includes/js/fancybox/extras/jquery.fancybox.pack.js"></script>
    		<script type="text/javascript" src="include/includes/js/fancybox/extras/jquery.mousewheel-3.0.6.pack.js"></script>
    		<script type="text/javascript">
    	$(document).ready(function() {
    		$("table#galimages a").fancybox(
    			{ 
    				'zoomSpeedIn': 800, 
    				'zoomSpeedOut': 500, 
    				'zoomSpeedChange': 800,
    				'zoomOpacity': 0.5,
    				'overlayOpacity': 0.5,
    				'easingIn' : 'easeOutBack',
    				'easingOut'	: 'easeInBack',
    				'overlayShow': true
    			}
    		);
    		
    		$("div#bbvideo a").fancybox(
    			{ 
    				'zoomSpeedIn': 800, 
    				'zoomSpeedOut': 500, 
    				'zoomSpeedChange': 800,
    				'zoomOpacity': 0.5,
    				'overlayOpacity': 0.5,
    				'overlayShow': true
    			}
    		);
    		});
       </script>
    </head>


    Und das habe ich in der bbcode.php eingeschrieben.
    $image = '<a rel="galimagesrel" href="'.$string.'"><img src="'.$string.'" alt="" title="" border="0" width="'.$this->info['ScreenMaxBreite'].'" height="'.$this->info['ScreenMaxHoehe'].'" '.$float.'/></a>';


    Meine Beta HP ist: projekt-ab.x-dream-moments.de/

    MFG BennY zwinker


    Zuletzt modifiziert von FightClub am 06.03.2014 - 10:57:50
    0 Mitglieder finden den Beitrag gut.
  16. #46
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Du solltest dann besser mit Klassen arbeiten, also mit dem rel Attribute, da es dafür native Browserunterstützung gibt.
    Also <a class="fancyImage" ....

    Und dann als Selector statt table#galimages a -> a.fancyImage verwenden.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  17. #47
    User Pic
    FightClub Mitglied
    Registriert seit
    02.06.2013
    Beiträge
    196
    Beitragswertungen
    1 Beitragspunkte
    ZitatZitat geschrieben von Mairu
    Du solltest dann besser mit Klassen arbeiten, also mit dem rel Attribute, da es dafür native Browserunterstützung gibt.
    Also <a class="fancyImage" ....

    Und dann als Selector statt table#galimages a -> a.fancyImage verwenden.


    Danke Danke Danke Danke Danke Danke Mairu zwinker

    Habe es Jetzt. zwinker

    MFG BennY
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Module und Modifikationen

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten