Ich bin auf der Suche nach einem Jquery-Slider-Skript, das in der Lage ist, von rechts nach links zu gleiten, während ich meine Maus bewege. Wer kennt diese Art von Skript? Ich möchte einen Effekt wie this one erreichen, aber es sollte horizontal, nicht vertikal gescrollt werden.Jquery Slider, der während der Mausbewegung gleitet
1
A
Antwort
8
Meinst du so etwas? Es ist eine sehr einfache Sache, die die jQuery UI Slider verwendet. Ich füge einen Handler an das mousemove-Ereignis an, das nur berechnet, was der Wert für den Schieberegler sein soll (basierend auf dem Wert der Mauskoordinaten).
$(function() {
var range = 100,
sliderDiv = $("#slider");
// Activate the UI slider
sliderDiv.slider({
min: 0,
max: range
});
// Number of tick marks on slider
var position = sliderDiv.position(),
sliderWidth = sliderDiv.width(),
minX = position.left,
maxX = minX + sliderWidth,
tickSize = sliderWidth/range;
$(this).mousemove(function(e) {
// If within the slider's width, follow it along
if (e.pageX >= minX && e.pageX <= maxX) {
var val = (e.pageX - minX)/tickSize;
sliderDiv.slider("value", val);
}
});
});
Es ist nicht fantastisch Code, um ehrlich zu sein, aber es hat ein einfaches Beispiel dafür, wie die jQuery UI Schieberegler verwendet werden und wie der Wert setzen Code.
Beispiel: http://jsfiddle.net/jonathon/qAMWQ/
Verwandte Themen
- 1. jQuery Slider gleitet einen Schritt zu weit
- 2. Mausposition während der Mausbewegung abrufen?
- 3. Glättung der Mausbewegung
- 4. Slider gleitet auf Klick, aber ich will nicht, diese
- 5. Wie ist der jQuery-Slider implementiert?
- 6. Slick Slider. Gibt es eine Möglichkeit zu überprüfen, wo der Schieberegler gleitet?
- 7. Berechnen des Winkels in Grad der Mausbewegung
- 8. jquery slider optimize ... vielleicht ein CSS-Trick?
- 9. Algorithmus zur Emulation der Mausbewegung als Mensch?
- 10. Simulation der Mausbewegung und Mausklick mit WatiN
- 11. jQuery UI Slider Nicht
- 12. jQuery Slider bubble
- 13. Responsive jQuery Slider
- 14. jQuery Slider springt unerwartet
- 15. Jquery Slider CSS-Problem
- 16. jquery easy image slider
- 17. jQuery Inhalt Slider: Einfachste
- 18. jQuery UI Slider springt
- 19. jQuery Slider-Tutorials?
- 20. JQuery Slider Probleme
- 21. jquery Inhalt Slider, Steuergeschwindigkeit?
- 22. jQuery slider funktioniert nicht
- 23. JQuery Content Slider Probleme
- 24. Erstellen Sie einen Kreis an der Mausposition bei Mausbewegung
- 25. Anpassen der jQuery UI Slider Höhe und Breite
- 26. JQuery UI Slider - 'Wert' nicht Einstellung der Startposition des Griffs
- 27. jQuery Slider von oben wie der auf Stackoverflow
- 28. JQuery Slider - Rufen Sie die Funktion nach der Folie
- 29. jQuery Slider UI - Verbesserungen
- 30. JQuery Slider arrows
nein, das ist nicht das, was ich meinte, die Sache ist, ich einen Effekt wie dies erreichen will http://articles.tutorboy.com/jquery/mouseover-auto-scroller-menu-using -jquery-and-css.html aber es sollte horizontal gescrollt werden, nicht vertikal. – David