Das Ganze setzt auf jQuery auf. Den Title-Tag eines a Elementes bekommst Du z.B. mit
TorbenCode:$("a").click(function (){ var x = $(this).attr("title"); alert (x); });
Ergebnis 1 bis 3 von 3
- 20.05.2010, 15:24 #1
Befehl für Link mit onClick
Hi zusammen,
ich habe folgendes Javascript um bestimmte Elemente ein- und ausblenden zu lassen. Wie müsste den hier der onClick Befehl im HTML aussehen um ein Element ein bzw. ausblenden zu lassen? Kann man das irgendwie rauslesen? Den mit dem Skript wird der Link automatisch aus einem Titel-Attribut "generiert" und ich würde den Link gerne einzeln nutzen, kann aber mit Javascript nicht wirklich viel anfangen. Mit Probieren bin ich bisher nicht weitergekommen.
Hier das Javascript das genutzt wird:
Code:/** * -------------------------------------------------------------------- * jQuery-Plugin "toggleElements" * Version: 1.3, 11.09.2007 * by Andreas Eberhard, andreas.eberhard@gmail.com * http://jquery.andreaseberhard.de/ * * Copyright (c) 2007 Andreas Eberhard * Licensed under GPL (http://www.opensource.org/licenses/gpl-license.php) * * Changelog: * 11.09.2007 Version 1.3 * - removed noConflict * - added 'opened'-state via additional class 'opened' * 02.07.2007 Version 1.2.1 * - changed blur to work with jQuery 1.1.3 * - added packed version * 27.06.2007 Version 1.2 * - suppress multiple animations * 15.06.2007 Version 1.1 * - added callbacks onClick, onShow, onHide * - added option showTitle * 31.05.2007 initial Version 1.0 * -------------------------------------------------------------------- * @example $(function(){$('div.toggler-1').toggleElements( );}); * @desc Toggles the div with class 'toggler-1' into closed state on document.ready * * @example $(function(){$('fieldset.toggler-9').toggleElements( { fxAnimation:'show', fxSpeed:1000, className:'toggler', onClick:doOnClick, onHide:doOnHide, onShow:doOnShow } );}); * @desc Toggles the fieldset with class 'toggler-9' into closed state on document.ready * Animation show with speed 1000 ms is used, for the different states the css-class-prefix 'toggler-' will be used * Events OnClick, OnHide, OnShow will call your JavaScript-functions * -------------------------------------------------------------------- */ var toggleElements_animating = false; (function($) { jQuery.fn.toggleElements = function(settings) { // Settings settings = jQuery.extend({ fxAnimation: "slide", // slide, show, fade fxSpeed: "normal", // slow, normal, fast or number of milliseconds className: "toggler", removeTitle: true, showTitle: false, onClick: null, onHide: null, onShow: null }, settings); var onClick = settings.onClick, onHide = settings.onHide, onShow = settings.onShow; if ((settings.fxAnimation!='slide')&&(settings.fxAnimation!='show')&&(settings.fxAnimation!='fade')) settings.fxAnimation='slide'; // First hide all elements without class 'opened' this.each(function(){ if (jQuery(this).attr('class').indexOf("opened")==-1){ jQuery(this).hide(); } }); // Add Toggle-Links before elements this.each(function(){ wtitle=''; wlinktext=jQuery(this).attr('title'); if (settings.showTitle==true) wtitle=wlinktext; if (settings.removeTitle==true) jQuery(this).attr('title',''); if (jQuery(this).attr('class').indexOf("opened")!=-1){ jQuery(this).before('<a class="'+settings.className+' '+settings.className+'-opened" href="#" title="'+ wtitle +'">' + wlinktext + '</a>'); jQuery(this).addClass(settings.className+'-c-opened'); } else { jQuery(this).before('<a class="'+settings.className+' '+settings.className+'-closed" href="#" title="'+ wtitle +'">' + wlinktext + '</a>'); jQuery(this).addClass(settings.className+'-c-closed'); } // Click-Function for Toggle-Link jQuery(this).prev('a.'+settings.className).click(function() { if (toggleElements_animating) return false; thelink = this; jQuery(thelink)[0].blur(); if (thelink.animating||toggleElements_animating) return false; toggleElements_animating = true; thelink.animating = true; // Callback onClick if ( typeof onClick == 'function' && onClick(thelink) === false) { toggleElements_animating = false; thelink.animating = false; return false; } // Hide Element if (jQuery(this).next().css('display')=='block') { jQuery(this).next().each(function(){ if (settings.fxAnimation == 'slide') jQuery(this).slideUp(settings.fxSpeed,function(){ jQuery.toggleElementsHidden(this,settings.className,onHide,thelink); }); if (settings.fxAnimation == 'show') jQuery(this).hide(settings.fxSpeed,function(){ jQuery.toggleElementsHidden(this,settings.className,onHide,thelink); }); if (settings.fxAnimation == 'fade') jQuery(this).fadeOut(settings.fxSpeed,function(){ jQuery.toggleElementsHidden(this,settings.className,onHide,thelink); }); }); // Show Element } else { jQuery(this).next().each(function(){ if (settings.fxAnimation == 'slide') jQuery(this).slideDown(settings.fxSpeed,function(){ jQuery.toggleElementsShown(this,settings.className,onShow,thelink); }); if (settings.fxAnimation == 'show') jQuery(this).show(settings.fxSpeed,function(){ jQuery.toggleElementsShown(this,settings.className,onShow,thelink); }); if (settings.fxAnimation == 'fade') jQuery(this).fadeIn(settings.fxSpeed,function(){ jQuery.toggleElementsShown(this,settings.className,onShow,thelink); }); }); } return false; }); }); }; // Remove/Add classes to Toggler-Link jQuery.toggleElementsHidden = function(el,cname,onHide,thelink) { jQuery(el).prev('a.'+cname).removeClass(cname+'-opened').addClass(cname+'-closed').blur(); if ( typeof onHide == 'function') onHide(this); // Callback onHide jQuery(el).removeClass(cname+'-c-opened').addClass(cname+'-c-closed'); toggleElements_animating = false; thelink.animating = false; }; jQuery.toggleElementsShown = function(el,cname,onShow,thelink) { jQuery(el).prev('a.'+cname).removeClass(cname+'-closed').addClass(cname+'-opened').blur(); if ( typeof onShow == 'function') onShow(this); // Callback onShow jQuery(el).removeClass(cname+'-c-closed').addClass(cname+'-c-opened'); toggleElements_animating = false; thelink.animating = false; }; })(jQuery); iMac (2010) 27" (10.7.3) | MacBook Pro (2011) 15" (10.7.3) | iPhone 4S (5.1)
„How to succeed? Try hard enough.“
Malcolm Forbes
✔ Facebook
- 20.05.2010, 15:55 #2
- 20.05.2010, 18:01 #3
Das habe ich schon verstanden. Ich möchte allerdings wissen wie ich mit einem onClick die Funktion aufrufen kann das die Box angezeigt bzw. ausgeblendet wird. Das muss doch irgendwie möglich sein oder?
iMac (2010) 27" (10.7.3) | MacBook Pro (2011) 15" (10.7.3) | iPhone 4S (5.1)
„How to succeed? Try hard enough.“
Malcolm Forbes
✔ Facebook


Zitieren
