JQuery beim Klicken in Wordpress ein-/ausblenden ⇐ HTML

[Anonymous]

Ich habe drei Schaltflächen, deren Farbe sich ändert, wenn Sie mit der Maus darüber fahren (Sprites), und ich möchte diese Schaltflächen so verwenden, dass beim Klicken darauf unterschiedliche Inhalte angezeigt werden.

Ich habe mehrere Tutorials/Boards durchgesehen und nichts scheint zu funktionieren.

Die Schaltflächen werden wie folgt angezeigt:

Code: Select all

[url=#][/url]
[url=#][/url]
[url=#][/url]

Die Divs, in denen der Inhalt platziert wurde (mein letzter Versuch), waren wie folgt:

Code: Select all

[img]...[/img]

[img]...[/img]

[img]...[/img]

jQuery----

Code: Select all

$(document).ready(function() {
$("a").click(function() {
var id = $(this).attribute("data-id"); // Using a custom attribute.
$("#pages div").hide(); // gather all the div tags under the element with the id pages and hide them.
$(".div" + id).show(); // Show the div with the class of .divX where X is the number stored in the data-id of the object that was clicked.
});
});
​​​​

Meine Anker scheinen falsch zu sein. Mit diesem Setup ging es einfach an den Anfang der Seite. Bei Verwendung des Ankers Nr. 1, Nr. 2 oder Nr. 3 würde es zum Div-Speicherort gehen, aber der Inhalt würde weder ausgeblendet noch angezeigt. Frustrierend.

Die Sprites funktionieren einwandfrei. Jetzt versuche ich herauszufinden, wie ich sie anklickbar machen kann, sodass beim Klicken auf jede Schaltfläche unterschiedliche Inhalte angezeigt werden (3 Divs – unter einem übergeordneten Div?). Wenn jemand genau weiß, wie das geht, wäre ich sehr dankbar.

Der Inhalt besteht größtenteils aus Bildern, und ich verwende das Jupiter-Theme mit einem Front-End-Editor, daher weiß ich nicht, ob daran etwas liegen könnte. Aber im Backend scheint nichts kaputt zu sein.

Außerdem wäre es legitim, wenn Sie mich auf ein Tutorial verweisen könnten, das mir beibringt, wie man es so hinbekommt, dass sie beim Klicken ein- und ausgeblendet werden. Nochmals vielen Dank.