jQuery - ScrollToPosts

jQuery, ScrollToPosts eklentisi, kullanımı.

by bizamajig

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>jQuery: ScrollToPosts</title>
        <script type="text/javascript">/**
            * jQuery.ScrollTo - Easy element scrolling using jQuery.
            * Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
            * Dual licensed under MIT and GPL.
            * Date: 5/25/2009
            * @author Ariel Flesler
            * @version 1.4.2
            *
            * http://flesler.blogspot.com/2007/10/jqueryscrollto.html
            */
            ;
            (function(d) {
            var k = d.scrollTo = function(a, i, e) {
            d(window).scrollTo(a, i, e)
            };
            k.defaults = {
            axis: 'xy',
            duration: parseFloat(d.fn.jquery) >= 1.3 ? 0 : 1
            };
            k.window = function(a) {
            return d(window)._scrollable()
            };
            d.fn._scrollable = function() {
            return this.map(function() {
            var a = this,
            i = !a.nodeName || d.inArray(a.nodeName.toLowerCase(), ['iframe', '#document', 'html', 'body']) != -1;
            if (!i) return a;
            var e = (a.contentWindow || a).document || a.ownerDocument || a;
            return d.browser.safari || e.compatMode == 'BackCompat' ? e.body : e.documentElement
            })
            };
            d.fn.scrollTo = function(n, j, b) {
            if (typeof j == 'object') {
            b = j;
            j = 0
            }
            if (typeof b == 'function') b = {
            onAfter: b
            };
            if (n == 'max') n = 9e9;
            b = d.extend({}, k.defaults, b);
            j = j || b.speed || b.duration;
            b.queue = b.queue && b.axis.length > 1;
  ...

CSS

body {
    background: #333;
    width: 400px;
    margin: 40px auto 100px;
    font-family: Segoe UI;
    color: #CCC;
}
a {
    color: #F5F5F5;
    text-decoration: none;
    outline: none;
}
.post {
    height: 600px;
    margin: 20px 0;
    padding: 5px 20px;
    background: #F5F5F5;
}
#comments {
    height: 1000px;
    margin: 20px 0;
    padding: 5px 20px;
    background: #F5F5F5;
}
#reply {
    height: 800px;
    margin: 20px 0;
    padding: 5px 20px;
    background: #FFF;
}
#nav-dock {
    position: fixed;
    right: 15px;
    top: 35%;
}
#nav-dock a {
    display: block;
    padding: 3px 10px;
    margin: 3px 0;
    background: #CCC;
    color: #000;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}
#nav-dock a:hover {
    background: #000;
    color: #FFF;
}
#nav-dock #next {
    margin-bottom: 10px;
}

JavaScript

// Bu uygulamada yer alan JavaScript kodları HTML içerisinde yer almaktadır. Yıkarıdan HTML sekmesine tıklayarak inceleyebilirsiniz. -->