HTML & Co » jquery fade in HILFE

Web Acappella - Forum, Tips und Tricks zum Bauen von Webseiten � Off Topic � HTML & Co � jquery fade in HILFE

Themen-Einstellungen

Bereich wechseln

Rund um das Forum SPAM - USER Vor dem Einloggen bitte die Nutzungsbedingungen und Datenschutzerkl�ru... Ank�ndigungen Hilfe Web Acappella ANK�NDIGUNGEN rund um Web Acappella Ank�ndigungen Version 4 Ank�ndigungen Version 3 SEITENVORSTELLUNGEN - stellt Eure Seiten vor und erntet Lob und Kritik FAQ - Antworten zu Programmfunktionen FAQ Allgemein FAQ Version 4 FAQ Version 3 FRAGEN ZU PROBLEMEN Allgemeine Fragen Fragen zur Version 4 Fragen zur Version 3 TIPPS UND TRICKS - Anleitungen zu Erweiterungen der Programmfunktionen Allgemeine Tipps und Tricks Tipps und Tricks f�r Version 4 Tipps und Tricks f�r Version 3 Tipps und Tricks f�r Responsive Design TEMPLATES UND PLUGINS - Design- und Script- Erweiterung zu Web Acappella FEHLER UND ANREGUNGEN rund ums Programm WEB - SHOP - SYSTEM Off Topic Mitglieder stellen sich vor Tools, Anwendungen HTML & Co Mac Windows Grafik Video Sonstiges

#1 | jquery fade in HILFE datum

30.01.2014 08:40

Hallo Forum,
ich bin schon eine ganze Weile hier als Gast unterwegs. Großes Lob an alle Mitglieder. Die Hilfestellungen und Lösungsansätze haben mir schon oft weitergeholfen.
Dennoch bin ich an einen Punkt gelangt, an dem ich Eure Hilfe benötige. Ich bin im web auf: http://www.tacca.com.br gestoßen und seitdem lässt mir die Seite keine Ruhe mehr. Nach Sichtung des Quelltextes habe ich versucht an die Scripte zu gelangen, jedoch ohne erfolg.
Hat jemand eine Idee wo ich ein ähnliches Script bekomme? Kurz gesagt: Image mit Infotext fade in oder slide in bei Seitenaufruf, Opazität ändern bei mouseover und fade out bei "click".
Bis jetzt habe ich nur Codefetzen gefunden. Gibt es ein jquery oder css3 mit dem ich alles umsetzen kann oder muß ich mehrere per js einbinden (z.B. jquery-1.3.2.min)?
Vielen Dank im Voraus für Eure Hilfe!

Antworten

#2 | RE: jquery fade in HILFE datum

30.01.2014 12:11

Jo,
willkommen hier im Forum.
Ja, schönen Seite hast Du da gefunden ( ...und sie ist nicht im Black-Design ;-)

An dieser Stelle mal klar gesprochen: Willst Du das genau so im Anspruch haben, musst Du das auch mit den Mitteln machen.
In diesem Fall ist das Word Press, und ich glaube du kannst das hier finden:

http://themeforest.net/category/wordpres...CFU2N3godPiQAZw

Es ist aber bestimmt auch angepasst.

Im Falle WebAcappella würde ich meine Ansprüche deutlich reduzieren, man kann das sicher als Vorlage nehmen, die slide und fade Effekte musst Du über schon mal über ein Fremdmodul lösen ( siehe hier in Suche ) und über die Typo Darstellung musst Du Dir auch andere Gedanken machen...

Ich habe noch nie einen Menschen getroffen, der wirklich einen Dübel haben wollte. In Wirklichkeit wollen die nur ein Bild aufhängen.

http://www.frischedesigner.de � http://www.frischedesign.de � http://www.tristyle.de

Antworten

#3 | RE: jquery fade in HILFE datum

30.01.2014 19:36

Hallo Harrison,

da gebe ich Dir Recht, es muß nicht immer alles black sein. ;-)
Ja, die Seite ist stimmig, gefällt mir auch ganz gut.

Danke für den Link, der ist mir bekannt, habe mich desöfteren auf envato codecanyon umgesehen.
WebAcappella ist ein sehr solides Programm und die Mittel und Möglichkeiten sind schon enorm.
Der Reiz an der Sache liegt aber eher darin, mit bestehenden Mitteln ein gutes Ergebnis zu erzielen, auch wenn die eigene Vorstellungskraft keine Grenzen kennt.

Um ehrlich zu sein habe ich dieses Problem fast gelöst:
Habe eine Seite in Imagegröße erstellt, einen Wow-Slider mit 2 Bildinformationen eingefügt. Das erste Bild ist ein transparentes png in Wunschgröße und das zweite Bild das Kategoriebild. Den Slider habe ich nach dem zweiten Bild gestoppt (Script angepasst). Das Ganze per html in meine Wunschseite integriert. Einen transparenten Button mit 20% weiß als Mouseover und Verknüpfung per "klick" angelegt - fertig.
Der Haken? Typoproblem? Durch Wow-Slider kein Problem! Leider kein fade oder slide out... (bei Gelegenheit poste ich einen Link)

Habe auch ein Tutorial bei Codrops mit ähnlicher Thematik gefunden, es ist aber sehr zeitintensiv die Scripte anzupassen.

Hier noch ein kleines Script für alle Tüftler:

Seiteneigenschaften:
<html>
<head>
<title>the title</title>
<script type="text/javascript"
src="http://www.meine_domain.de/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" language="javascript">

$(document).ready(function() {

$("#down").click(function(){
$(".target").slideDown( 'slow', function(){
$(".log").text('');
});
});

$("#up").click(function(){
$(".target").slideUp( 'slow', function(){
$(".log").text('');
});
});

});
</script>
<style>
p {
background-color:#fff;
width:200px;
border:1px solid green;
}
</style>
</head>

html-Code:

<body>

<button id="up"> Slide Up </button>
<button id="down"> Slide Down</button>

<div class="target">
<img src="http://www.meine_domain.de/images/Image.jpg" alt="jQuery" /></a> onlocation

</div>
<div class="log"></div>

</body>

Funktioniert ganz gut jedoch bei Tastenklick und ohne Mouseover.

Mein Credo: Niemals aufgeben!

Hat noch jemand einen Ansatz?

Antworten

#4 | RE: jquery fade in HILFE datum

30.01.2014 19:52

Jo,
wäre natürlich besser, man könnte sich das mal ansehen, also warten wir auf den link.

Antworten

#5 | RE: jquery fade in HILFE datum

02.02.2014 14:26 (zuletzt bearbeitet: 02.02.2014 14:29)

Ein Link zu einer Beispielseite wäre hilfreich, ja...

Antworten

HTML � � Google+ Verknüpfung

Bitte geben Sie einen Grund f�r die Verwarnung an