[GastForen Programmierung/Entwicklung JavaScript Mit Javascript auf CSS-Eigenschaften zugreifen ...

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

Mit Javascript auf CSS-Eigenschaften zugreifen ...

Canio
Beiträge gesamt: 174

20. Nov 2006, 18:43
Beitrag # 1 von 3
Bewertung:
(1685 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo, habe ein kniffliges Problem zu lösen.
Folgende html-Struktur liegt vor:

Code
<div id="category"> 
<div id="category-top"></div>
<div id="category-content"></div>
<div id="category-bottom"></div>
<div id="category-track">
<img id="category-handle" src="pics/closing_btn.gif"/>
</div>
</div>


Per Javascript generiere ich eine ungeordnete Liste, die ich in den div mit der id "category-content" schreibe. Jeder <li>-Tag erhält über CSS verschiedene Eigenschaften, wie z.B. ein Hintergrundbild. Vor allem aber erhält "category-content" overflow: hidden. Ist der Inhalt also zu groß, wird dieser abgeschnitten. Klappt aber nur mit den Hintergrundbildern der <li>-Tags. Die Textknoten aber, die sich innerhalb der Tags befinden, gehen über den div hinaus, werden also nicht wie gewünscht abgeschnitten. Wie sorge ich dafür, dass der Text verschwindet?

Noch ein Problem: wie kann ich per Javascript auf CSS-Eigenschaften von Elementen zugreifen, die nachträglich per Javascript erstellt wurden? document.getElementById(id).style."eigenschaft" funktioniert bei mir nicht.

Und noch eine Frage: Wie kann ich per Javascript Elemente scrollen, die wie oben beschrieben die CSS-Eigenschaft overflow: hidden haben? Ich möchte quasi eigene Scrollbars benutzen, z.B. mit dem scriptaculous-Framework. Geht das überhaupt? Wenn ja, wie???

Teste z.Zt. alles im IE 6.

Viele Fragen, ich hoffe ich erhalte auch viele gute Antworten :)!
X

Mit Javascript auf CSS-Eigenschaften zugreifen ...

ganesh
Beiträge gesamt: 1981

20. Nov 2006, 21:18
Beitrag # 2 von 3
Beitrag ID: #262863
Bewertung:
(1671 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Noch ein Problem: wie kann ich per Javascript auf CSS-Eigenschaften von Elementen zugreifen, die nachträglich per Javascript erstellt wurden? document.getElementById(id).style."eigenschaft" funktioniert bei mir nicht.

- - - -

wär natürlich nützlich zu sehen, wie du diese Elemente überhaupt erstellst...

das hier geht nämlich absolut problemlos, auch im IE6:


<html>
<head>
<title>hello DOM</title>
</head>
<body>


<div id="container"></div>


<script type="text/javascript">

var theNewParagraph = document.createElement('p');
var theTextOfTheParagraph = document.createTextNode('hello DOM');
theNewParagraph.appendChild(theTextOfTheParagraph);
document.getElementById('container').appendChild(theNewParagraph);

theNewParagraph.id = 'foo';
document.getElementById('foo').style.color="#FF00FF";
document.getElementById('foo').style.fontSize="20";

var que = document.getElementById('foo').style.color;
document.write(que);

</script>


</body>
</html>


als Antwort auf: [#262830]

Mit Javascript auf CSS-Eigenschaften zugreifen ...

Canio
Beiträge gesamt: 174

21. Nov 2006, 11:45
Beitrag # 3 von 3
Beitrag ID: #262919
Bewertung:
(1657 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo, erstellen tu ich das Menü mit scriptaculous, und zwar so:

Code
var html = "<li class='list'>" 
+ "<div class='category-list-entry'>"
+ "<img src='pics/category_back.gif'></img>"
+ "</div>"
+ "<div class='category-link'>"
+ "<a href='#'>" + category + "</a>"
+ "</div>"
+ "</li>";
new Insertion.Bottom("category-list", html);


Klappt auch problemlos.

Ich hab mittlerweile herausgefunden, dass ich zum Scrollen des Contents die Eigenschaft scrollTop benutzen kann, wenn das entsprechende Element auf overflow:hidden gesetzt ist (das scrollen wollte ich ja bezwecken). Für's erste umgehe ich also das Problem des Ansprechens. Der Frage muss ich ein anderes Mal nachgehen.

Doch ich hab eine neue Frage, die ich in's CSS-Forum stelle. Da könnte ja mal jemand nachschauen :).


als Antwort auf: [#262863]

Aktuell

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
05.02.2021 - 05.11.2021

Digicomp Academy AG, Limmatstrasse 50, 8005 Zürich
Freitag, 05. Feb. 2021, 13.00 Uhr - Freitag, 05. Nov. 2021, 17.00 Uhr

Lehrgang

Bilden Sie sich zum zertifizierten Publishing-Multimedia-Profi aus. Neben Fotografie und Video befassen Sie sich mit der Medienproduktion, digitalen Publikationen und dem Webdesign für Desktop- und mobile Endgeräte.

Preis: CHF 10'500.-
Dauer: 30 Tage (ca. 210 Lektionen) – Unterricht findet jeweils am Freitag von 13 - 19 Uhr und Samstag von 09 - 17 Uhr statt

Ja

Organisator: Digicomp Academy AG

Kontaktinformation: Kundenberater-Team, E-Mailkundenberatung AT digicomp DOT ch

digicomp.ch/d/9PM

Veranstaltungen
01.03.2021 - 05.03.2021

Persönlichkeitsentwicklung

Online
Montag, 01. März 2021, 00.17 Uhr - Freitag, 05. März 2021, 00.18 Uhr

Webinar

Personal Power Coaching - Um was geht es? ​ Potenzialentfaltung: Potenzial entdecken und entfalten Talente entdecken: Deine Talente und Fähigkeiten erkennen und loslegen Gewohnheiten: schlechte Gewohnheiten durch Positive ersetzen Selbstbewusstsein stärken: Dein Bewusstsein stärken Eigendynamik entwickeln: Mehr Erfolg durch Eigenverantwortung & Disziplin Ängste kontrollieren: Ängste als Antrieb nutzen Entscheidungen treffen: Mit mehr Mut an die Sache ran! Lebensenergie steigern: Deine Lebensenergie steigern und aufrechterhalten Ziele erreichen: Ziele setzen und übertreffen! Motivationssteigerung: Mehr Erfolg durch Selbstmotivation Selbstvertrauen: Selbstvertrauen auf- und ausbauen

Details:
https://www.snfa.ch/swiss-personal-power-birolisik

Ja

Organisator: Birol Isik

Kontaktinformation: Birol Isik, E-Mailinfo AT snfa DOT ch

https://www.snfa.ch/swiss-personal-power-birolisik

Neuste Foreneinträge


Affinity Designer

Optimierung doc2pdf-withPresets.jsx

Layout / Bildauflösung druckfertig anlegen

Affinity Publisher 1.9

Alternative Acrobat Pro

Affinity Photo

Open CL-Berschleunigung

Studiovorgaben (Workspace) beim Programmstart vorgeben?

Illustrator AI in Designer öffnen

Verknüpfung mit Format aufheben
medienjobs