Web fragen

[VD3???]

So folgende Sache ich habe eine Overlay.js geschrieben. So eine wie auf Winrar.com Quasi eine "Dont leave massage". Ich will aber gern das es nur dann aktiviert wir wenn die Maus von unten nach oben geführt wird(tabschlisen). leider funktioniert meine funktion in beide richtungen. Was muss ich machen damit es nur von unten nach oben getrackt wird? Vorschläge?

[Whiz-zarD]

Ich versteh nicht, was du meinst, aber wenn ich dich richtig verstanden habe, dann muss immer ein Delta der Mauszeiger-Position ermittelt werden, den du dann auswertest.
Vielleicht kann man auch einen endlichen Automaten bauen, der durch Mausbewegungen seinen Zustand ändert, und dann bei einem bestimmten Zustand den Pop-Up auslöst.

Ich weiß aber nicht, wofür man sowas für eine Webseite benötigt. Mir persönlich gehen eh schon diese Warnhinweise, einiger Webseiten, auf den Sack, wenn man ein Tab schließen möchte. Das zeigt eine gewisse unseriösität, da man letztem Endes überhaupt nich weiß, was passiert, wenn man auf die Buttons klickt.

[Jesus_666]

Zuerst mal: Volle Zustimmung mit Whiz-zarD. Solche Meldungen sind nur dann angemessen, wenn ein Formular angezeigt wird, das der Besucher bereits (teilweise) ausgefüllt, aber noch nicht abgesendet hat. Eine allgemeine Meldung, weil jemand die Seite verläßt, ist für mich ein guter Grund, die Seite nicht wieder zu betreten. Bei halb ausgefüllten Formularen ist die Rückfrage okay, weil man möglicherweise das Absenden vergessen hat, aber ansonsten ist es schlicht ein Versuch, den Benutzer auf einer Seite festzuhalten, die ihn gerade nicht weiter interessiert. Höchst unprofessionell.

So, nachdem das aus dem Weg ist: Sehe ich das richtig, dass du eine Aktion ausführen willst, wenn jemand mit der Maus den Viewport über den oberen Rand verläßt? Das halte ich für problematisch:

• Das Verlassen des Viewports nach oben korreliert nicht zwangsläufig mit dem Schließen des Tabs. Der Besucher könnte schlicht zu einem anderen Tab wechseln.
• Der Besucher könte auch den Viewport in eine andere Richtung verlassen und von dort aus zur Tableiste gehen, z.B. wenn er zwischendurch in eine andere Anwendung klickt. Nicht jeder hat den Browser auf Vollbild laufen.
• Man kann Tabs auch auf andere Arten schließen, z.B. über Tastenkombinationen oder Mausgesten.
• Die Methode funktioniert nicht auf Mobilgeräten, weil die in der Regel andere Events erzeugen.

Du solltest statt dessen einen Event-Handler auf beforeunload binden, welcher selbstverständlich sicher stellt, dass auch mindestens ein Formularfeld ausgefüllt ist – es macht meist keinen Sinn, zu warnen, wenn das Formular gar nicht angefaßt wurde.

[VD3???]

Danke für diese Tipps =) Hat mir sehr geholfen. Ich konnte mein Problem lösen =D

Ihr kennt sicherlich jqueryUI ich hab mir daraus eine einfache "shake" funktion gebastelt die sogar css enthält. Ich habe dafür den Shaker Effect genutzt. Nun weiss ich aber nciht wie ich diesen effect aufrufenkan(mit hilfe eines buttons(beispiel klick. Ansich funzt alles wunderbar aber ich muss leider auf "demo-box make bg-color visibel" klicken damit es anfängt zu shaken.

onclick="myFunction() kommt also nicht in Frage da es net funzt.

HTML-Code:

<script>
$(function(shake_by_time){
		var demoTimeout;
		$('#shake_me').click(function(){
			$this = $(this);
			clearTimeout(demoTimeout);
			$this.trigger('startShake');
			demoTimeout = setTimeout(function(){$this.trigger('stopShake');}, 700)
		});
		$('#shake_me').jshaker({
			x: 4,
			y: 0, 
			rotation: 0
		});

		shakeStart();
		
});
</script>

....

<div id="shake_me">demo-box make bg-color visibel</div> // dieser Inhalt macht den shaker 

<button id="btn"> Click to Shake </button>

ich glaube ich muss iwas mit document.getElementsByClassName machen, aber ich hab kp wie ich das machen soll damit der Button funktioniert

kann einer sagen was ich tippen muss ?

[Eli]

Wenn du jQuery verwenden willst, schadet es nicht sich ein wenig damit auseinander zu setzen.
In der jQuery UI API Documentation steht ja eigentlich schon drin was du brauchst:

Code:

$( document ).click(function() {
  $( "#toggle" ).effect( "shake" );

});

Statt document nimmst du jetzt halt das Element, welches du mit der Funktion belegen willst.

[VD3???]

THX für die antwort, ich werde ma schauen ob es klappt =)

Frage:

Ich würde gern einen dashboard erstellen wo ich namen + email + infotext einfügen kann. Ich könnte das per hand in HTML machen, jedoch will ich das gern dynamisch machen. Sprich ich hab ein extra feld wo ich alles eintragen kann + speichern. Ist es möglich das dieser Vorgang auch in offline modus funktioniert?

[Whiz-zarD]

Ich würde gern einen dashboard erstellen wo ich namen + email + infotext einfügen kann. Ich könnte das per hand in HTML machen, jedoch will ich das gern dynamisch machen. Sprich ich hab ein extra feld wo ich alles eintragen kann + speichern. Ist es möglich das dieser Vorgang auch in offline modus funktioniert?

...

Was ist an einem extra Feld dynamisch?

[Eli]

Ich denke, er meinte auf dem Dashboard wird das alles angezeigt.
Er möchte aber nicht, das alles dort statisch rumliegt und er jedes Mal seine HTML-Datei anfassen muss, um was hinzuzufügen,
sondern eben über dieses Feld.

Mit JavaScript only geht's jedenfalls nicht, auch nicht "online". Wenn du z.B. PHP installiert hast, geht das schon (auch "offline").

[Whiz-zarD]

Wenn du z.B. PHP installiert hast, geht das schon (auch "offline").

...

Und wie willst du ein serverseitiges Script ohne Server ausführen?
Irgendwer muss dem Interpreter Bescheid geben, dass er arbeiten soll. Ein Browser macht dies nicht.

[Eli]

Und wie willst du ein serverseitiges Script ohne Server ausführen? Irgendwer muss dem Interpreter Bescheid geben, dass er arbeiten soll. Ein Browser macht dies nicht.

...

Ja, den Server kann er sich ja auch installieren.

[Whiz-zarD]

Dann ist es aber nicht mehr offline

[Mivey]

Dann ist es aber nicht mehr offline

...

Nicht wenn der Server im localhost läuft. Da gibt es sicherlich viele praktische Anwendungen.

[Whiz-zarD]

Nicht wenn der Server im localhost läuft.

...

Naja, finde ich schon. Offline heißt für mich, dass keinerlei Verbindung zu einem Server aufgebaut wird.
Auch wenn der Server zufällig auf der eigenen Maschine läuft, wird eine Verbindung aufgebaut. Es wird hier ja ein Loopback aufgebaut, folglich muss hier was laufen, was über das Netzwerk kommunizieren kann.
Wenn ein Gerät offline ist, heißt das, dass nicht mal ein Loopback aufgebaut werden kann.

[Mivey]

Naja, finde ich schon. Offline heißt für mich, dass keinerlei Verbindung zu einem Server aufgebaut wird.
Auch wenn der Server zufällig auf der eigenen Maschine läuft, wird eine Verbindung aufgebaut. Es wird hier ja ein Loopback aufgebaut, folglich muss hier was laufen, was über das Netzwerk kommunizieren kann.
Wenn ein Gerät offline ist, heißt das, dass nicht mal ein Loopback aufgebaut werden kann.

...

Kann man auch so sehen. So oder so sicherlich komplett nutzlos für jede praktische real-world Anwendung. Eventuell zum Austesten?

Ich find, btw, das ist echt der bizzarste Hilfe-Thread im MMX, sicherlich aber im Progforum

[VD3???]

@ Mivey
ja das kann schon sein hier gehts ja immer um Web fragen das für mich ein sammle therad für random fragen die ich nicht jedesmal im thema aufmachen will ^^

@ all
Die Vorschläge hören sich gut an, aber vielleicht sollte ich dann diese offline Geschichte fürn Anfang raus nehmen. Ich könnte natürlich auf google docs oder sogar FB gruppe ausweichen, aber das ist ja nicht wirklich mein ziel.

[VD3???]

so leute ne kurze frage, befor ich mich vor dem dozenten blamiere XD

t = time;
m = Math.floor(t/60) %60;
s = t %60;
m = (m < 10) ? "0"+m : m;
s = (s < 10) ? "0"+s : s;

also ich bin mir nicht sicher wie der browser das rechnet: nehmen wir einen wer in sec zb. 1850 s

s= Math.floor(1850/60) %60; ergebnis- 30,83 >> d.h. 30min

diesen wert noch durch 60 und wir kriegen 30min & 50sec

ist da soweit richtig?

[Whiz-zarD]

Wo liegt denn das Problem?

Code:

var second = Math.floor(time / 60);
var minute = time % 60;

Warum rechnest du für die sekunden noch mal mit Modulo 60? Das ist doch unsinn.
Math.floor(time / 60) gibt dir schon die 30, und 30 Modulo 60 ergibt nur 0 Rest 30.

Edit:
Außerdem wäre es Sinnvoller den Teil:

Code:

m = (m < 10) ? "0"+m : m;
s = (s < 10) ? "0"+s : s;

in eine Funktion auszulagern. Also sprich eine Funktion, die dir die Zahl mit den passenden Nullen am Anfang zurückgibt.
Halte dich ein wenig an das DRY-Prinzip.

z.B.

Code:

...
m = pad(m, 2) + "m";
s = pad(s, 2) + "s";
...
function pad(num, size) {
    var result = num + "";

    while (result.length < size) 
        result = "0" + result;

    return result;
}

Das ist jetzt ein bisschen generischer, falls man sowas öfters braucht und sich die Anzahl der Ziffern ändert.
Leider bietet JavaScript von Haus aus keine Möglichkeit Strings bequem zu formatieren.

[VD3???]

Danke für den Feedback, hat mir sehr geholfen =)

Nun hab ich ein paar Unklarheiten Bezüglich der Lade zeit bzw Preformance der Internet seiten.

Ich weiss schon mal das zuerst die docs geladen werden und dan erst die bilder. Damit die lade zeit kürzer bleibt fasst man scripte (docs) zusammen genau wie die css ect. Gibts eine Funktion zum download die alle meine css docs zusammen fast in eine x.min.css ? Bzw wie geht man da vor?

Was muss noch alles beachtet werden damit die Seite nicht aus gebremst wird? Klar je nach Anbieter und Lokalisation kann die Übertragungsrate variieren, aber gehen wir mal von der Programmierung aus.

MfG
vd3