HTMLWorld - HTML, CSS, JavaScript, PHP, Java, Flash und vieles mehrHTMLWorld:   Home | Impressum
 

 
 

Anzeige 
 
HTMLWorld » Forum

Thema anzeigen - Template Modifikation für Joomla von newbi (Ajax)

 FAQFAQ   SuchenSuchen   MitgliederlisteMitgliederliste   BenutzergruppenBenutzergruppen   RegistrierenRegistrieren 
 ProfilProfil   Einloggen, um private Nachrichten zu lesenEinloggen, um private Nachrichten zu lesen   LoginLogin 

Template Modifikation für Joomla von newbi (Ajax)

 

Neues Thema eröffnen   Neue Antwort erstellen    HTMLWorld Foren-Übersicht
   JavaScript
Vorheriges Thema:
Nächstes Thema:  
Autor Nachricht
Final



Anmeldungsdatum: 04.01.2007
Beiträge: 1
Wohnort: Berlin

BeitragVerfasst am: 04.01.2007 17:31:33    Titel: Template Modifikation fär Joomla von newbi (Ajax) Antworten mit Zitat

Hallo an alle im Forum,
ich habe nach einem passendem Forum für Anfängerfragen gesucht, leider nicht gefunden, also auf "gutglück" hier gepostet.

Vorweg, ich habe sogut wie keine Ahnung vom coden, also verzeiht mir bitte ggf. handwerkliche Fehler.

Hintergrund der Anfrage: www.felix-tom.com

Template Joomla os.

Dieses habe ich insoweit modifiziert, alsdas das Symbol des Fotoapperates (in der Statuszeile) ein neues Fenster öffnet.

Funktioniert, alles schön.

Ich möchte aber gerne, das das öffnen des Fensters auch aus dem Pulldownmenu funkioniert.

Leider kann ich den Code nicht "flüssig" lesen. (windows2 und 3 sind von mir, der aufruf über das icon klappt, im Pulldown leider nicht.)

Angefügt weiter unten ist der source, könnte jemand von euch einmal darüberschauen, und mir ggf. die augen öffnen? Smile

Vorab schon einmal danke fürs lesen bis hierher.

Hier der Quelltext:

window.onload=function(){

<!--Makes all windows draggable.-->

var draggables = $S('.container');

draggables.each(function(el){

el.makeDraggable({handle: el.getElementsBySelector('.handle')[0]});

el.makeResizable({handle: el.getElementsBySelector('.resize')[0]});

});

}

</SCRIPT>
<META content="MSHTML 6.00.2900.2912" name=GENERATOR>
</HEAD>
<BODY>
<!--This is the Main Window where the text appears. The ID="ajax" makes this the window that updates using the AJAX call-->
<DIV id="main" class="container">
<div class="wrapper">
<DIV class="resize"></DIV>
<DIV class="handle"></DIV>
</div>
<DIV id="ajax" class="content">
<?php mosLoadModules ( 'top', -2 ); ?>
<?php mosMainBody(); ?>
<?php mosLoadModules ( 'bottom', -2 ); ?>
</DIV>
</DIV>
<!--This is the top toolbar menu (for the different effects). See the javascript at the bottom for configuration.-->
<div class="toolbar">
<div id="tools">
<ul>
<li id="home"><a id="contentRun" href="index.php"></a></li>
<li id="info"><a id="infoRun" href="javascript:void(0)"></a></li>
<li id="login"><a id="loginRun" href="javascript:void(0)"></a></li>
<li id="map"><a id="colorRun" href="javascript:void(0)"></a></li>
<li id="open"><a id="resizeContentRun" href="javascript:void(0)"></a></li>
<li id="paper"><a id="resizeContentSmall" href="javascript:void(0)"></a></li>
<li id="resize"><a id="contentWindowResize" href="javascript:void(0)"></a></li>
<li id="search"><a id="searchRun" href="javascript:void(0)"></a></li>
<li id="photo"><a id="photoRun" href="javascript:void(0)"></a></li>
</ul>
</div>
</div>
<!--This is the blue bar at the top and the "start" button-->
<div id="topmenuBar">
<div id="joomlaOS">
<ul>
<li id="OSbutton"><a id="topmenuRun" href="javascript:void(0)"></a></li>
</ul>
</div>
</div>
<!--This is the menu that shows up when you click the "start" button. You can use the module positions for the mod_mainmenu or enter in your own links. It is recommended you use the onlick "new ajax...." for items you are going to link to inside the site. id="topmenuContent" is the left column, id="topmenuBlue" is the right column (note that they are styled differently. Here is an example of using static links in a list for the ajax loads (from the example site):
<ul id="mainlevel-blue">
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_content&task=view&id=12&Itemid=9', {update: $('ajax')});" href="#">About the OS</a> </li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_content&task=view&id=13&Itemid=9', {update: $('ajax')});" href="#">Ajax Usage</a></li>
</ul>
-->
<div id="topmenu">
<DIV class="slide" id="topmenuContent">
<div class="moduletable">
<ul id="mainlevel">
<li><a href="http://felix-tom.com/index.php" class="mainlevel" id="active_menu">Home</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_content&task=category&sectionid=1&id=1&Itemid=2" class="mainlevel" >News</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_easybook&Itemid=26" class="mainlevel" >Gästebuch</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_weblinks&Itemid=23" class="mainlevel" >Links</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_contact&Itemid=3" class="mainlevel" >Kontakt</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_search&Itemid=5" class="mainlevel" >Suche</a></li>
<li><a href="http://www.ektm.de/" target="_blank" class="mainlevel" >MamaPapaPage</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_content&amp;task=category&amp;sectionid=3&amp;id=7&amp;Itemid=25" class="mainlevel" >FAQs</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_content&amp;task=category&amp;sectionid=3&amp;id=7&amp;Itemid=25" class="mainlevel" id="active_menu">Dummy</a></li>
<li><a href="http://felix-tom.com/index.php?option=com_registration&task=register" class="mainlevel" id="active_menu">Registrieren</a></li>
</ul>
</div>
<div id="topmenuBlue">
<ul id="mainlevel-blue">
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_login&Itemid=4', {update: $('ajax')});" href="#">An- und Abmelden</a></li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_user&task=UserDetails&Itemid=21', {update: $('ajax')});" href="#">Your Details</a></li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_content&task=new&sectionid=1&Itemid=0', {update: $('ajax')});" href="#">News erstellen</a></li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_content&task=view&id=14&Itemid=9', {update: $('ajax')});" href="#">Future Plans</a></li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_content&task=view&id=16&Itemid=9', {update: $('ajax')});" href="#">Positions/Tools</a></li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_registration&task=register', {update: $('ajax')});" href="#">Inspired By</a></li>
<li><a class="mainlevel-blue" onclick="new ajax ('index2.php?option=com_login&Itemid=16', {update: $('ajax')});" href="#">Abmelden</a></li>
</ul>

<?php mosLoadModules ( 'user2', -2 ); ?>
</div>
</div>
</DIV>
<!--This javascript enables the top menu (under the start button)-->
<SCRIPT type=text/javascript>

var topmenuContenteffect = new Fx.Opacity('topmenuContent').hide();

$('topmenuRun').addEvent('click', topmenuContenteffect.toggle.bind(topmenuContenteffect));

</SCRIPT>
<!--Search Window activated by the top toolbar (note that you can place anything in these windows).-->
<DIV id="searchWindow">
<DIV class="searchBOX">
<?php mosLoadModules ( 'inset', -2 ); ?>
</DIV>
</DIV>
<!--Javascript enabling the Search Window's opacity-->
<SCRIPT type=text/javascript>

var searchWindoweffect = new Fx.Opacity('searchWindow').hide();

$('searchRun').addEvent('click', searchWindoweffect.toggle.bind(searchWindoweffect));

</SCRIPT>
<!--Another Window, activated by the toolbar.-->
<div id="loginWindow" class="container">
<div class="wrapper">
<DIV class="resize"></DIV>
<DIV class="handle"></DIV>
</div>
<DIV class="content">
<?php mosLoadModules ( 'left', -2 ); ?>
</DIV>
</DIV>
<!--Javascript enabling the Search Window's opacity-->
<SCRIPT type=text/javascript>

var loginWindoweffect = new Fx.Opacity('loginWindow').hide();

$('loginRun').addEvent('click', loginWindoweffect.toggle.bind(loginWindoweffect));

</SCRIPT>
<!--Another Window, activated by the toolbar. This is more or less, the "Footer" but in a window-->
<div id="infoWindow" class="container">
<div class="wrapper">
<DIV class="resize"></DIV>
<DIV class="handle"></DIV>
</div>
<DIV class="content">
<p align="center"><img src="templates/joomla_operating_system/images/logo_s.jpg" alt="EKTM.de for support" width="86" height="32" align="middle" /></p>
<p align="center"><strong>JOOMLA OS 1.11</strong><br />
Brought to you by Beautyindsign.com<br />
Powered by<a href="http://www.ektm.de" target="_blank"> EKTM.de!</a> and <a href="http://mootools.net/" target="_blank">MooTools</a>,and also Joomla</p>
<?php mosLoadModules ( 'right' ); ?>
</DIV>
</DIV>
<!--Test new Window btw. user 4--->
<div id="Window2" class="container">
<div class="wrapper">
<DIV class="resize"></DIV>
<DIV class="handle"></DIV>
</div>
<DIV id="ajax" class="content">
<?php mosLoadModules ( 'user4' ); ?>
</DIV>
</DIV>
<SCRIPT type=text/javascript>

var Window2effect = new Fx.Opacity('Window2').hide();

$('photoRun').addEvent('click', Window2effect.toggle.bind(Window2effect));

</SCRIPT>
<!--Javascript enabling the above Window's opacity-->
<SCRIPT type=text/javascript>

var infoWindoweffect = new Fx.Opacity('infoWindow').hide();

$('infoRun').addEvent('click', infoWindoweffect.toggle.bind(infoWindoweffect));

</SCRIPT>
<!--Test new Window btw. user 5--->
<div id="Window3" class="container">
<div class="wrapper">
<DIV class="resize"></DIV>
<DIV class="handle"></DIV>
</div>
<DIV id="ajax" class="content">
<?php mosLoadModules ( 'user5' ); ?>
</DIV>
</DIV>
<SCRIPT type=text/javascript>

var Window2effect = new Fx.Opacity('Window3').hide();

$('photoRun').addEvent('click', Window2effect.toggle.bind(Window2effect));

</SCRIPT>
<!--Javascript enabling the above Window's opacity-->
<SCRIPT type=text/javascript>

var infoWindoweffect = new Fx.Opacity('infoWindow').hide();

$('infoRun').addEvent('click', infoWindoweffect.toggle.bind(infoWindoweffect));

</SCRIPT>
<!--Javascript controlling the functions of the top toolbar. You can use any CSS styling by following the format used below.-->
<SCRIPT type=text/javascript>



var maineffect = $('main').effects();



$('resizeContentRun').addEvent('click', function(){

maineffect.custom({

'font-size': [12, 24]

});

});



var maineffect = $('main').effects();



$('resizeContentSmall').addEvent('click', function(){

maineffect.custom({

'font-size': [18, 12]

});

});



var maineffect = $('main').effects();



$('contentWindowResize').addEvent('click', function(){

maineffect.custom({

'opacity': [1, .5]

});

});



var maineffect = $('main').effects();



$('colorRun').addEvent('click', function(){

maineffect.custom({

'width': [590, 1000],

'height': [590, 550],

'left': [325, 5]

});

});
</SCRIPT>
</BODY>
</HTML>

Gruß Final
Nach oben
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
Beiträge der letzten Zeit anzeigen:   
Neues Thema eröffnen   Neue Antwort erstellen    HTMLWorld Foren-Übersicht
   JavaScript
Alle Zeiten sind GMT + 1 Stunde
Seite 1 von 1

 
Gehe zu:  
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst deine Beiträge in diesem Forum nicht bearbeiten.
Du kannst deine Beiträge in diesem Forum nicht löschen.
Du kannst an Umfragen in diesem Forum nicht mitmachen.