Hallo, ich habe mir diese kostenlose Extension installiert: Animate It
Auf der Demoseite des Entwicklers gibt es eine Animation mit der Überschrift "SHOW OFF YOUR AWESOME WORK".
Hierbei fliegt der Text von links und die Grafik vomrechts auf gleicher Höhe ein.
Den html-Code hierzu habe ich mir zum Testen kopiert. Er sieht bei mir wie folgt aus:
<div class="custom animated bounceInLeft eds-on-scroll ">
<h3 style="text-align: left; padding-top: 100px;">Show Off Your Awesome Work!</h3>
<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit<br /> esse molestie consequat, vel illum dolore eu feugiat nulla<br /> facilisis at vero eros et accumsan et iusto odio dignissim<br /> qui blandit praesent luptatum zzril delenit augue duis dolore te<br /> feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend<br /> option congue nihil imperdiet doming id quod mazim placerat<br /> facer possim assum.</p>
</div>
<div class="rt-grid-5 rt-omega">
<div class="rt-block animated bounceInRight eds-on-scroll ">
<div class="module-surround">
<div class="module-content">
<div class="custom animated bounceInRight eds-on-scroll ">
<p style="text-align: right;"><img src="images/clown525.gif" alt="" width="200" height="300" /></p>
</div>
</div>
</div>
</div>
</div>
Alles anzeigen
Allerdings erscheint bei mir die Grafik nicht auf gleicher Höhe, sondern unterhalb des Textes:
http://test.mcv-moemlingen.net/index.php/test-ani
Was muss ich denn ändern, um den gleichen Effect zu erzielen, wie auf der oben erwähnten Demo-Seite?
Kann ich die Position der Grafik auch noch vertikal verändern?
Ich denke es hat etwas mit Grids zu tun, nur weiß ich nicht genau, wie ich diese einfügen kann.
Vielleicht kann mir hier jemand weiterhelfen.
L.G.
Kurt