kostenloser Webspace werbefrei: lima-city

Horizontaler fx.Slide (mootools) für div

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   keingerede

   

   keingerede hat kostenlosen Webspace.

   22:52, 3.8.2008

   Schönen Abend!
   
   Geht um Folgendes:
   Habe auf meinem kleinen zukünftigen Blogprojekt (http://blog.sowizo.de/) fx.Slide laufen. Funktioniert eigentlich wunderbar (siehe Mehr/Weniger lesen), der Code hierfür sieht so aus:
   
   

   window.addEvent(\'domready\', function() {
           var status = {
                   \'true\': \'open\',
                   \'false\': \'close\'
           };
           
           var fullSlide = new Fx.Slide(\'full_slide\').hide();
           var shortSlide = new Fx.Slide(\'short_slide\');
   
   
           $(\'full_slidein\').addEvent(\'click\', function(e){
                   e.stop();
                   fullSlide.slideIn();
                   shortSlide.slideOut();
           });
   
           $(\'full_slideout\').addEvent(\'click\', function(e){
                   e.stop();
                   fullSlide.slideOut();
                   shortSlide.slideIn();
           });
   });

   
   
   bzw.
   
   

   <div style=\"text-align:justify; padding:3px; margin-top:3px; margin-bottom:5px;\"><div id=\"short_slide\">{short-story}<br /><a id=\"full_slidein\" href=\"#\">Mehr lesen...</a></div><div id=\"full_slide\">{full-story}<br /><a id=\"full_slideout\" href=\"#\">Weniger lesen...</a></div></div>

   
   
   Andererseits will ich per horizontalen Slide den Styleswitcher links vom Header ein-/ausblenden. Das funktioniert jedoch weniger so wie ich es gerne hätte. Code:
   
   

   var styleswitcherSlideIn = new Fx.Slide(\'styleswitcher_slide_in\', {mode: \'horizontal\'});
           var styleswitcherSlideOut = new Fx.Slide(\'styleswitcher_slide_out\', {mode: \'horizontal\'}).hide();
                   
           $(\'styleswitcher_slidein\').addEvent(\'click\', function(e){
                   e.stop();
                   styleswitcherSlideOut.slideOut();
                   styleswitcherSlideIn.slideIn();
           });
   
           $(\'styleswitcher_slideout\').addEvent(\'click\', function(e){
                   e.stop();
                   styleswitcherSlideIn.slideOut();
                   styleswitcherSlideOut.slideIn();
           });

   
   
   

   <div id=\"styleswitcher\"><div id=\"styleswitcher_slide_in\"><a id=\"styleswitcher_slideout\" href=\"#\">&lt;&lt;</a> | <a id=\"styleswitcher_slidein\" href=\"#\">&gt;&gt;</a></div>
   <div id=\"styleswitcher_slide_out\">
   <a href=\"#\" onclick=\"setActiveStyleSheet(\'light\'); return false;\">H E L L</a><br />
   <a href=\"#\" onclick=\"setActiveStyleSheet(\'dark\'); return false;\">DUNKEL</a></div>
   </div>
   

   
   
   Hat da jemand eine Idee?
   
   Besten Dank im Voraus. ;)
   
   
   Beitrag geändert: 3.8.2008 22:52:45 von keingerede
   
   
   Beitrag geändert: 3.8.2008 22:53:26 von keingerede
   
   
   Beitrag geändert: 3.8.2008 22:54:06 von keingerede

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?