Auf Thema antworten 2026

Beitrag

<blockquote data-quote="stroyer" data-source="post: 1670662" data-attributes="member: 263373">AW: Java Script Menübalken...ein Fehler ist folgender in der JS:[code]&nbsp; function enable(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }}function enable(){[/code]Die function enable gehört nicht extra sondern oben eingefügt.Du hast ein paar Funktionen doppelt drinnen. Im Tutorial werden die von Schritt zu Schritt ergänzt.Der richtige JS-Code:[code]function makeScrollable(wrapper, scrollable){&nbsp; &nbsp; // Get jQuery elements&nbsp; &nbsp; var wrapper = $(wrapper), scrollable = $(scrollable);&nbsp; &nbsp; &nbsp; &nbsp; // Hide images until they are not loaded&nbsp; &nbsp; scrollable.hide();&nbsp; &nbsp; var loading = $(&#039;&lt;div class=&quot;loading&quot;&gt;Loading...&lt;/div&gt;&#039;).appendTo(wrapper);&nbsp; &nbsp; &nbsp; &nbsp; // Set function that will check if all images are loaded&nbsp; &nbsp; var interval = setInterval(function(){&nbsp; &nbsp; &nbsp; &nbsp; var images = scrollable.find(&#039;img&#039;);&nbsp; &nbsp; &nbsp; &nbsp; var completed = 0;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Counts number of images that are succesfully loaded&nbsp; &nbsp; &nbsp; &nbsp; images.each(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (this.complete) completed++;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (completed == images.length){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; clearInterval(interval);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Timeout added to fix problem with Chrome&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; setTimeout(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; loading.hide();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Remove scrollbars&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; wrapper.css({overflow: &#039;hidden&#039;});&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; scrollable.slideDown(&#039;slow&#039;, function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; enable();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }, 1000);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }, 100);&nbsp; &nbsp; &nbsp; &nbsp; function enable(){&nbsp; &nbsp; &nbsp; &nbsp; // height of area at the top at bottom, that don&#039;t respond to mousemove&nbsp; &nbsp; &nbsp; &nbsp; var inactiveMargin = 99;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Cache for performance&nbsp; &nbsp; &nbsp; &nbsp; var wrapperWidth = wrapper.width();&nbsp; &nbsp; &nbsp; &nbsp; var wrapperHeight = wrapper.height();&nbsp; &nbsp; &nbsp; &nbsp; // Using outer height to include padding too&nbsp; &nbsp; &nbsp; &nbsp; var scrollableHeight = scrollable.outerHeight() + 2*inactiveMargin;&nbsp; &nbsp; &nbsp; &nbsp; // Do not cache wrapperOffset, because it can change when user resizes window&nbsp; &nbsp; &nbsp; &nbsp; // We could use onresize event, but it&#039;s just not worth doing that &nbsp; &nbsp; &nbsp; &nbsp; // var wrapperOffset = wrapper.offset();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Create a invisible tooltip&nbsp; &nbsp; &nbsp; &nbsp; var tooltip = $(&#039;&lt;div class=&quot;sc_menu_tooltip&quot;&gt;&lt;/div&gt;&#039;)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .css(&#039;opacity&#039;, 0)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .appendTo(wrapper);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Save menu titles&nbsp; &nbsp; &nbsp; &nbsp; scrollable.find(&#039;a&#039;).each(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(this).data(&#039;tooltipText&#039;, this.title);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Remove default tooltip&nbsp; &nbsp; &nbsp; &nbsp; scrollable.find(&#039;a&#039;).removeAttr(&#039;title&#039;);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Remove default tooltip in IE&nbsp; &nbsp; &nbsp; &nbsp; scrollable.find(&#039;img&#039;).removeAttr(&#039;alt&#039;);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var lastTarget;&nbsp; &nbsp; &nbsp; &nbsp; //When user move mouse over menu&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; wrapper.mousemove(function(e){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Save target&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; lastTarget = e.target;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var wrapperOffset = wrapper.offset();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var tooltipLeft = e.pageX - wrapperOffset.left;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Do not let tooltip to move out of menu.&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Because overflow is set to hidden, we will not be able too see it &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltipLeft = Math.min(tooltipLeft, wrapperWidth - 75); //tooltip.outerWidth());&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var tooltipTop = e.pageY - wrapperOffset.top + wrapper.scrollTop() - 40;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Move tooltip under the mouse when we are in the higher part of the menu&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (e.pageY - wrapperOffset.top &lt; wrapperHeight/2){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltipTop += 80;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltip.css({top: tooltipTop, left: tooltipLeft});&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Scroll menu&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var top = (e.pageY -&nbsp; wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight - inactiveMargin;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (top &lt; 0){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; top = 0;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; wrapper.scrollTop(top);&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Setting interval helps solving perfomance problems in IE&nbsp; &nbsp; &nbsp; &nbsp; var interval = setInterval(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (!lastTarget) return;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var currentText = tooltip.text();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (lastTarget.nodeName == &#039;IMG&#039;){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // We&#039;ve attached data to a link, not image&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var newText = $(lastTarget).parent().data(&#039;tooltipText&#039;);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Show tooltip with the new text&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (currentText != newText) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltip&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .stop(true)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .css(&#039;opacity&#039;, 0)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .text(newText)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .animate({opacity: 1}, 1000);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }, 200);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // Hide tooltip when leaving menu&nbsp; &nbsp; &nbsp; &nbsp; wrapper.mouseleave(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; lastTarget = false;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltip.stop(true).css(&#039;opacity&#039;, 0).text(&#039;&#039;);&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; /*&nbsp; &nbsp; &nbsp; &nbsp; //Usage of hover event resulted in performance problems&nbsp; &nbsp; &nbsp; &nbsp; scrollable.find(&#039;a&#039;).hover(function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltip&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .stop()&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .css(&#039;opacity&#039;, 0)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .text($(this).data(&#039;tooltipText&#039;))&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .animate({opacity: 1}, 1000);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }, function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; tooltip&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .stop()&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .animate({opacity: 0}, 300);&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; */&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }}&nbsp; &nbsp; $(function(){&nbsp; &nbsp; &nbsp; &nbsp; makeScrollable(&quot;div.sc_menu_wrapper&quot;, &quot;div.sc_menu&quot;);});[/code]Bezüglich Dreamweaver: Kann sein, dass hinten ein Strichpunkt fehlt?CSS von [code]body p {&nbsp; &nbsp;&nbsp; font-family: Arial, Helvetica, sans-serif; } body p {&nbsp; &nbsp;&nbsp; font-size: 10px; } body p {&nbsp; &nbsp;&nbsp; font-weight: bold; } body p {&nbsp; &nbsp;&nbsp; font-family: &quot;Lucida Sans Unicode&quot;, &quot;Lucida Grande&quot;, sans-serif; } body p {&nbsp; &nbsp;&nbsp; font-family: Arial, Helvetica, sans-serif; } body p {&nbsp; &nbsp;&nbsp; font-size: 12px; } body p {&nbsp; &nbsp;&nbsp; font-size: 10px; }[/code]könntest du zusammenfassen, der erzeugte Code vom DW ist wie gewohnt schrecklich, was aber nichts an der Funktionalität ändert.</blockquote>

[QUOTE="stroyer, post: 1670662, member: 263373"] [b]AW: Java Script Menübalken...[/b] ein Fehler ist folgender in der JS: [code] function enable(){ } } function enable(){ [/code]Die function enable gehört nicht extra sondern oben eingefügt. Du hast ein paar Funktionen doppelt drinnen. Im Tutorial werden die von Schritt zu Schritt ergänzt. Der richtige JS-Code: [code] function makeScrollable(wrapper, scrollable){ // Get jQuery elements var wrapper = $(wrapper), scrollable = $(scrollable); // Hide images until they are not loaded scrollable.hide(); var loading = $('<div class="loading">Loading...</div>').appendTo(wrapper); // Set function that will check if all images are loaded var interval = setInterval(function(){ var images = scrollable.find('img'); var completed = 0; // Counts number of images that are succesfully loaded images.each(function(){ if (this.complete) completed++; }); if (completed == images.length){ clearInterval(interval); // Timeout added to fix problem with Chrome setTimeout(function(){ loading.hide(); // Remove scrollbars wrapper.css({overflow: 'hidden'}); scrollable.slideDown('slow', function(){ enable(); }); }, 1000); } }, 100); function enable(){ // height of area at the top at bottom, that don't respond to mousemove var inactiveMargin = 99; // Cache for performance var wrapperWidth = wrapper.width(); var wrapperHeight = wrapper.height(); // Using outer height to include padding too var scrollableHeight = scrollable.outerHeight() + 2*inactiveMargin; // Do not cache wrapperOffset, because it can change when user resizes window // We could use onresize event, but it's just not worth doing that // var wrapperOffset = wrapper.offset(); // Create a invisible tooltip var tooltip = $('<div class="sc_menu_tooltip"></div>') .css('opacity', 0) .appendTo(wrapper); // Save menu titles scrollable.find('a').each(function(){ $(this).data('tooltipText', this.title); }); // Remove default tooltip scrollable.find('a').removeAttr('title'); // Remove default tooltip in IE scrollable.find('img').removeAttr('alt'); var lastTarget; //When user move mouse over menu wrapper.mousemove(function(e){ // Save target lastTarget = e.target; var wrapperOffset = wrapper.offset(); var tooltipLeft = e.pageX - wrapperOffset.left; // Do not let tooltip to move out of menu. // Because overflow is set to hidden, we will not be able too see it tooltipLeft = Math.min(tooltipLeft, wrapperWidth - 75); //tooltip.outerWidth()); var tooltipTop = e.pageY - wrapperOffset.top + wrapper.scrollTop() - 40; // Move tooltip under the mouse when we are in the higher part of the menu if (e.pageY - wrapperOffset.top < wrapperHeight/2){ tooltipTop += 80; } tooltip.css({top: tooltipTop, left: tooltipLeft}); // Scroll menu var top = (e.pageY - wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight - inactiveMargin; if (top < 0){ top = 0; } wrapper.scrollTop(top); }); // Setting interval helps solving perfomance problems in IE var interval = setInterval(function(){ if (!lastTarget) return; var currentText = tooltip.text(); if (lastTarget.nodeName == 'IMG'){ // We've attached data to a link, not image var newText = $(lastTarget).parent().data('tooltipText'); // Show tooltip with the new text if (currentText != newText) { tooltip .stop(true) .css('opacity', 0) .text(newText) .animate({opacity: 1}, 1000); } } }, 200); // Hide tooltip when leaving menu wrapper.mouseleave(function(){ lastTarget = false; tooltip.stop(true).css('opacity', 0).text(''); }); /* //Usage of hover event resulted in performance problems scrollable.find('a').hover(function(){ tooltip .stop() .css('opacity', 0) .text($(this).data('tooltipText')) .animate({opacity: 1}, 1000); }, function(){ tooltip .stop() .animate({opacity: 0}, 300); }); */ } } $(function(){ makeScrollable("div.sc_menu_wrapper", "div.sc_menu"); }); [/code]Bezüglich Dreamweaver: Kann sein, dass hinten ein Strichpunkt fehlt? CSS von [code] body p { font-family: Arial, Helvetica, sans-serif; } body p { font-size: 10px; } body p { font-weight: bold; } body p { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; } body p { font-family: Arial, Helvetica, sans-serif; } body p { font-size: 12px; } body p { font-size: 10px; } [/code] könntest du zusammenfassen, der erzeugte Code vom DW ist wie gewohnt schrecklich, was aber nichts an der Funktionalität ändert. [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ★ = 12, ◇ = 4 und die Hälfte von ★ zu ◇ addiert wird, was ist das Ergebnis?