dial_scroll

by hitode909 2011-09-06 [2011/09/06 20:33:43]

ダイヤルでスクロールできます

@@ -1,3 +1,4 @@
+
 /*
  * @title dial_scroll
  * @description ダイヤルでスクロールできます
@@ -79,12 +80,16 @@
         position: "fixed",
         top: 0,
         left: 0,
-        border: "10px solid black"
   });
   $("body").append($wrapper);
+  var accel = 0;
   $wrapper.dial(function(diff) {
-      window.scrollBy(0, diff * 100);
+      accel += diff * 10;
   });
+  setInterval(function() {
+      window.scrollBy(0, accel);
+      accel *= 0.9;
+  }, 30);
   $("body").mousemove(throttle(function() {
       console.log("show");
       $wrapper.show();

• 
  /*
   * @title dial_scroll
   * @description ダイヤルでスクロールできます
   * @include http://*
   * @license MIT License
   * @require jQuery
   */
  
  (function($) {
    var throttle;
    throttle = function(fn, delay) {
      var timer;
      timer = null;
      return function() {
        var args, context;
        if (timer) {
          return;
        }
        context = this;
        args = arguments;
        return timer = setTimeout(function() {
          timer = null;
          return fn.apply(context, args);
        }, delay);
      };
    };
    var debounce;
    debounce = function(fn, delay) {
      var timer;
      timer = null;
      return function() {
        var args, context;
        if (timer) {
          clearTimeout(timer);
        }
        context = this;
        args = arguments;
        return timer = setTimeout(function() {
          timer = null;
          return fn.apply(context, args);
        }, delay);
      };
    };
    $.fn.dial = function(callback) {
      var container, last;
      last = null;
      container = this;
      return $(container).mousemove(throttle(function(event) {
        var center, diff, distance, rad, x, y;
        center = {
          left: $(container).position().left + $(container).width() / 2,
          top: $(container).position().top + $(container).height() / 2
        };
        x = event.pageX - center.left;
        y = event.pageY - center.top;
        distance = Math.sqrt(x * x + y * y);
        rad = Math.atan(y / x);
        if (x < 0) {
          rad += Math.PI;
        }
        if (last == null) {
          last = rad;
        }
        diff = rad - last;
        if (diff < -Math.PI) {
          diff += Math.PI * 2;
        }
        if (diff > Math.PI) {
          diff -= Math.PI * 2;
        }
        callback.apply(container, [diff, distance]);
        return last = rad;
      }, 100));
    };
  
    var $wrapper = $("<div>").css({
          width: "100%",
          height: "100%",
          position: "fixed",
          top: 0,
          left: 0,
    });
    $("body").append($wrapper);
    var accel = 0;
    $wrapper.dial(function(diff) {
        accel += diff * 10;
    });
    setInterval(function() {
        window.scrollBy(0, accel);
        accel *= 0.9;
    }, 30);
    $("body").mousemove(throttle(function() {
        console.log("show");
        $wrapper.show();
    }, 50));
    $("body").mousemove(debounce(function() {
        console.log("hide");
        $wrapper.hide();
    }, 100));
  })(jQuery);
  

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

  このページへの個別リンクです。

  RAW

  書かれたコードへの直接のリンクです。

  Packed

  文字列が圧縮された書かれたコードへのリンクです。

  Userscript

  Greasemonkey 等で利用する場合の .user.js へのリンクです。

  Loader

  @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。

  Metadata

  コード中にコメントで @xxx と書かれたメタデータの JSON です。