You are not logged in.

Scroll 2 Top Nobelversion für Epsilon W2D 5.0

Controlpanel

Active User

At the moment there aren´t any members active..

Statistic

  • Members: 13109
  • Threads: 18183
  • Postings: 119668 (ø 46.08/day)

  • Greetings to our newest member: misssusan

w2d Premium-Support

Die Experten für web to date / shop to date

Facebook

elf

Beginner

  • "elf" started this thread

Posts: 1

  • Send private message

1

Friday, September 10th 2010, 5:36pm

Scroll 2 Top Nobelversion für Epsilon W2D 5.0

Ich finde es lästig, wenn man bei langen Webseiten am Ende der Seite mit dem Mausrad oder Scrollbalken wieder hochrollen muss. Komfortabler ist da schon ein kleiner Pfeil, der unten rechts am Ende der Seite auftaucht.

Der Pfeil ist aber nicht einfach so knack und da, sonder wird schön sanft eingeblendet. Bei einem Klick darauf, scrollt der Seite wieder ganz „piano“ nach oben. Die Animationszeit ist in der Datei „scroll.js“ einstellbar. Sie steht derzeit auf 500 Millisekunden und kann beliebig zum Beispiel mit dem Notepad-Editor verändert werden. Einfach mal mit den Werten spielen.

Installation:

Alle Dateien, die zu bearbeiten sind, befinden sich im Ordner "Designs » Epsilon"

Öffne die Datei „navigation.ccml“ und suche in der Datei die Zeile:

<script type="text/javascript" src="<cc:print value="&menuscript.url">"></script>

(ist so ziemlich am Anfang, na ja beinahe am Anfang…).

Nach dieser Zeile und VOR dem </head>-Tag folgenden Code einfügen:

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<!-- *** Script Scroll 2 Top *** vor </head>-Tag!! *** -->

<script type="text/javascript" src="<cc:print value="&top_js.url">"></script>
<script type="text/javascript" src="<cc:print value="&scr_top.url">"></script>
<script type="text/javascript">

$(document).ready(function () {
$(window).scroll(function() {

if($(window).scrollTop() > 10)
	$('#scrolltotop').fadeIn(1000);
else
	$('#scrolltotop').fadeOut(1500);
});
});
//]]>
</script>

<!-- *** Ende Script Scroll 2 Top *** -->


Scrolle zum Ende der Datei und suche die Zeilen:

</body>
</html>

Füge VOR </body> diesen Code ein:

Source code

 
1
2

<!-- *** Scroll 2 Top vor </body>-Tag *** -->
<div id="scrolltotop" onclick="return scrollToTop();" style="display: none;"><cc:printpicture xhtml="1" obj="pic.top"></div>


navigation.ccml nun speichern und schließen.



Öffne die Datei „global.ccml“ und suche die Zeile:

<cc:picture obj="pic.fade" dst="pfade.gif" src="pic_fade.gif">

Füge NACH dieser Zeile folgenden Code ein:

Source code

 
1
2
3

<cc:picture obj="pic.top" dst="pic_top.gif" src="pic_top.gif">
<cc:asset src="jquery.js" dst="jq.js" obj="top_js">
<cc:asset src="scroll.js" dst="scroll.js" obj="scr_top">


Datei „global.ccml“ speichern und schließen.


Datei „style_design.css“ öffnen und am Ende diesen Code einfügen:

Source code

 
1
2
3
4
5
6
7

#scrolltotop {
position: fixed;
bottom: 10px;
right: 10px;
cursor: pointer;
z-index: 1000;
}



Kopiere aus der entpackten „scroll2top.rar“-Datei die Dateien:

jquery.js
pic_top.gif
scroll.js

in den Epsilon Design-Ordner. Das war‘s. Nun noch einen schönen langen Content anlegen und staunen!

Das war meine erste Anleitung für W2D. Ist sie verständlich? Wenn ja, dann kommt noch mehr – aber leider nur für W2D 5.0. Was anderes kann ich mir nicht leisten - :wink:

Im Download ist diese Anleitung nochmals als PDF enthalten. Viel Spaß
elf has attached the following file:

bernhard 1967

Professional

  • "bernhard 1967" is male

Posts: 689

Location: aus da Steiamoark

Occupation: Arbeiter

web/shop to date Version: 5

  • Send private message

2

Friday, September 10th 2010, 9:31pm

Re: Scroll 2 Top Nobelversion für Epsilon W2D 5.0

Hallo elf

Also, ich möchte mich recht herzlich für den Tipp bedanken und hoffe, es folgen noch viele davon :clap2
_ . _ . _ . _

lg Bernhard
__________

bernhard 1967

Professional

  • "bernhard 1967" is male

Posts: 689

Location: aus da Steiamoark

Occupation: Arbeiter

web/shop to date Version: 5

  • Send private message

3

Sunday, September 12th 2010, 4:31pm

Re: Scroll 2 Top Nobelversion für Epsilon W2D 5.0

Hallo elf

Habe es auch ins Rho eingebaut, dank Deiner tollen Anleitung null Problemo. Hier auf meiner SV Seite zu sehen
Funktioniert einwandfrei, super:
bernhard 1967 has attached the following file:
  • Unbenannt.PNG (10.84 kB - 134 times downloaded - latest: May 15th 2012, 3:26pm)
_ . _ . _ . _

lg Bernhard
__________

TrienenBiene

Beginner

Posts: 28

  • Send private message

4

Monday, July 18th 2011, 7:12pm

Halli Hallo,

habe mir ""scroll-2-top-epsilon.rar"" runter geladen, Leider gibt es beim entpacken eine Fehlermaldung. Hat jemand zufälliger Weise noch eine ganze Version und könnte diese mir zukommen lassen...

Mit freundlichen Grüßen

de TrienenBiene