Это исходный код подключаемого модуля прокрутки JS, который я написал во время китайского Нового года. Я не удовлетворен результатами результатов. Я вернулся, чтобы консолидироваться и изучить JS в глубине. Этот плагин имеет следующие неудовлетворительные аспекты:
Для чрезмерных последствий контента вы можете обратиться к прокрутке в недавнем списке сеансов клиента QQ. Его прокрутка очень гладкая, проще говоря, ему не хватает эффектов перехода анимации.
Не идеальная совместимость, стиль под IE6 и 7 все еще немного ошибочен.
Стиль несовершенен, например, стержень прокрутки отображается только тогда, когда мышь приостановлен, а эффект скрыт после удаления.
Внутренняя структура сбивает с толку, и структура содержания должна быть скорректирована.
В конце концов, изображение прокрутки не является художником, и очень отвратительно вырезать картину самостоятельно ...
В целом, это все еще можно посмотреть, но все еще не хватает анимации. Когда я написал этот плагин, я понял, что мой плагин использовал некоторые относительно основные функции, поэтому я подумал, что эти функции должны быть инкапсулированы. Я недавно изучаю JS в последнее время. Прочитав под рукой книгу, я должен начать писать этот плагин основной функции. Конечно, механизм анимации необходим. Без лишних слов исходный код здесь (примечание: полная версия этого плагина имеет изображения, пожалуйста, загрузите полный плагин в вложении в конце статьи):
CSS
Кода -копия выглядит следующим образом:
.lf_scroll, .lf_scroll li {Padding: 0; поля: 0; Список стиля: нет; Шрифт: 14px/24px "helvetica neue", helvetica, arial, 'microsoft yahei', sans-serif; Схема: нет; }
.lf_scroll {cursor: pointer; Ширина: 10px; позиция: абсолютно; Справа: 0; Верх: 0; Фильтр: альфа (непрозрачность = 50); -Моз-мобилизация: 0,5; -khtml-opbouty: 0,5; непрозрачность: 0,5; }
.lf_scrollfocus {filter: alpha (непрозрачность = 100); -Моз-мобилизация: 1; -Khtml-opacity: 1; непрозрачность: 1; }
.lfs_top, .lfs_center, .lfs_bottom {founale: url ('scrollbar.gif'); Ширина: 10px; Высота: 10px; }
.lfs_top {background-position: 1px 0px; }
.lfs_center {background-position: center 0; высота: 100px; }
.lfs_bottom {founal Position: -22px 0; }
/*Конфигурация разработчиков*/
.Rolldiv {высота: 100%; Ширина: 100%; переполнение: скрыто; позиция: относительно; }
JavaScript
Кода -копия выглядит следующим образом:
/*
* Этот плагин определяется на стержне прокрутки веб -страницы моделирования, пожалуйста, вставьте после привязки для событий DOM
*
* Версия комментария: 1.0.0
* Автор: Linkfly
* Sina: сосредоточиться на полувека для вас | Cnblogs: http://www.cnblogs.com/silin6/ | Электронная почта: [email protected]
* Дата: 2014-02-05 02:38:35
*
*
* Двойная лицензия по лицензии MIT и GPL:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
*/
(функция (окно, неопределенное) {
// Информация о параметрах конфигурации
var config = {
Авто: правда,
высота: «Авто»,
Ширина: «Авто»
};
var linkflyscroll = function (dom, options) {
/// <summary>
/// 1: Сгенерировать смоделированный объект прокрутки, [пожалуйста, свяжите события с объектом, указанным после работы этого объекта, в противном случае события, которые вы связали ранее, не будут работать].
/// 1.1 - LinkFlyScroll (dom) - генерировать объект прокрутки в указанном DOM
/// 1.2 - LinkFlyScroll (Dom, Options) - генерировать объекты прокрутки и предоставить серию параметров, которые позволяют настроить рабочую модель для настройки объекта.
/// </summary>
/// <param name = "dom" type = "string или element">
/// Пропустите в объекте JS DOM или идентификатор объекта строки типа
/// </param>
/// <param name = "options" type = "json">
/// Настроить рабочую модель этого объекта со следующими параметрами:
/// [Необязательно] Auto (Boolean): Когда контент не достигнет высоты контейнера, будет ли автоматически скрыт стержень прокрутки? По умолчанию верно (да)
/// [Необязательно] Высота (int или String): блок по умолчанию - PX, который может быть int и string. Если значение является автоматическим, высота CSS используется по умолчанию.
/// [Необязательно] ширина (int или string): блок по умолчанию - PX, который может быть int и string. Если значение является автоматическим, ширина CSS используется по умолчанию.
/// </param>
/// <return type = "linkflyscroll"/>
if (typeof (dom) === 'string') {
dom = document.getElementbyId (dom);
}
// не указан DOM и не найдено допустимого DOM
// linkflyscroll ("" "), linkflyscroll (null), linkflyscroll (не определен)
if (! dom ||! dom.nodeType)
вернуть это;
// Создать объект контейнера
var scollobj = document.createElement ('div');
// Объект контента глубоко клонирован и не содержит событий, поэтому вам нужно подождать, пока объект LinkFlyScroll не закончится, прежде чем вы сможете привязать события с объектом DOM.
var cloneObj = dom.clonenode (true);
scrollobj.classname = 'rolldiv';
scollobj.appendchild (cloneobj);
// заменить текущий объект на странице
dom.parentnode.replacechild (scollobj, dom);
вернуть новый linkflyscroll.prototype.init (scollobj, опции? Параметры: {});
};
linkflyscroll.prototype.init = function (dom, options) {
/// <summary>
/// 1: этот объект является реальным объектом. Особый способ работы заключается в том, что могут быть статические вызовы и экземпляры звонков LinkflyScroll
/// 1.1 - init (dom, опции) - генерировать объект прокрутки в указанном DOM
/// </summary>
/// <param name = "dom" type = "element">
/// объект DOM
/// </param>
/// <param name = "options" type = "json">
/// Настроить рабочую модель этого объекта со следующими параметрами:
/// [Необязательно] Auto (Boolean): Когда контент не достигнет высоты контейнера, будет ли автоматически скрыт стержень прокрутки? По умолчанию верно (да)
/// [Необязательно] Высота (int или String): блок по умолчанию - PX, который может быть int и string. Если значение является автоматическим, высота CSS используется по умолчанию.
/// [Необязательно] ширина (int или string): блок по умолчанию - PX, который может быть int и string. Если значение является автоматическим, ширина CSS используется по умолчанию.
/// </param>
/// <return type = "linkflyscroll"/>
/*
* Этот объект содержит следующие свойства:
* ISDRAG: Является ли прокрутка
* starttop: (работа)
* Конечный столик: (Работаю)
* TopLimit: верхняя предельная позиция полоса прокрутки
* Bottomlimit: предельное положение в нижней части стержня прокрутки
* Контекст: контент dom
* scrollradix: прокрутка кардинальности
* Цель: контейнер Dom
*/
// Текущий этот объект, чтобы предотвратить часто часто изменение этого указателя в окружающей среде (например, при привязке событий), сохраните текущий объект.
var curscroll = this;
// Домиль
if (dom.nodeType) {
// Сохранить контейнер и контент dom
currscroll.target = dom;
currscroll.context = dom.firstchild;
// слияние параметров конфигурации
currscroll.options = tool.extend (config, options);
if (currscroll.options.width! == 'Auto') {
dom.style.width = tool.convertvalue (currscroll.options.width);
}
if (currscroll.options.height! == 'Auto') {
dom.style.height = tool.convertvalue (currscroll.options.height);
}
// Найти действительный DOM
while (currscroll.context.nodetype! = 1) {
currscroll.context = currscroll.context.nextibling;
}
// Создание прокрутки Dom
currscroll.scrollul = document.createElement ('ul');
currscroll.scrollul.classname = 'lf_scroll';
currscroll.scrollul.appendchild (tool.setclass ('li', 'lfs_top'));
currscroll.scrollul.appendchild (tool.setclass ('li', 'lfs_center'));
currscroll.scrollul.appendchild (tool.setclass ('li', 'lfs_bottom'));
currscroll.context.style.position = 'относительный';
// присутствовать на странице, прежде чем вы сможете прочитать данные о местоположении
dom.appendchild (currscroll.scrollul);
this.change ();
Tool.AddScrolleVent (currsCroll.context, function (e) {
// Связывая событие колеса мыши, 3PX -прокрутка
if (e.wheel> 0) {// Прокрутки колесных колес вверх вверх
var currtop = currscroll.endtop -= 3;
currscroll.scrollevent.call (currscroll, currtop);
} else {// Колеса прокрутки прокручивается вниз
var currtop = currscroll.endtop += 3;
currscroll.scrollevent.call (currscroll, currtop);
}
});
// Запрещенный текст выбирается при перетаскивании TODO
// Нажмите на событие под мышью, и вам нужно определить, является ли это щелчком налево. В настоящее время щелкнут правой кнопкой мыши также будет осознавать прокрутку Todo.
tool.addevent (currscroll.scrollul, 'mousedown', function (e) {
mousedown.call (currscroll, e);
});
// Добавить события для реализации мониторинга на теле для лучшего пользовательского опыта
Tool.Addevent (Document.Body, 'MouseMove', function (e) {
if (currscroll.isdrag) {
// Получить текущую позицию мыши
var position = tool.getmouseepos (e);
// текущая верхняя позиция полоса прокрутки
var currtop = (currscroll.endtop + position.y - currscroll.starttop);
// вызов должен точно определить этот указатель на этот рабочий объект
currscroll.scrollevent.call (currscroll, currtop);
}
вернуть ложь;
});
// Добавить событие выпуска мыши и прослушать тело, чтобы точно захватить событие выпуска
tool.addevent (document.body, 'mouseup', function () {
mouseup.call (currscroll, []);
});
var mousedown = function (e) {
/// <summary>
/// 1: событие прессы мыши
/// 1.1 - Mousedown (E) - событие Mousedown в прессе Scrollbar
/// </summary>
/// <param name = "e" type = "event">
/// Объект события
/// </param>
/// <return type = "linkflyscroll"/>
currscroll.isdrag = true;
// Получить текущую позицию мыши y
currscroll.starttop = tool.getmouseepos (e) .y;
tool.addclass (currscroll.scrollul, 'lf_scrollfocus');
вернуть ложь;
};
var mouseup = function () {
/// <summary>
/// 1: событие выпуска мыши
/// 1.1 - MouseUp () - MouseUp () - Событие Scrollbar выпустить в прокрутке
/// </summary>
/// <return type = "linkflyscroll"/>
currscroll.isdrag = false;
currscroll.endtop = currscroll.scrollul.style.top? parseint (currscroll.scrollul.style.top): 0;
Tool.RemoveClass (currscroll.scrollul, 'lf_scrollfocus');
вернуть ложь;
};
currscroll.scrollevent = function (currtop) {
/// <summary>
/// 1: событие прокрутки (ядро), просто передайте координаты, которые необходимо прокрутить (верхняя часть прокрутки)
/// 1.1 - Scrollevent (curtop) - Событие Core Scroll
/// </summary>
/// <param name = "currtop" type = "int">
/// Верхнее значение вершины стержня прокрутки из предыдущего слоя контейнера
/// </param>
/// <return type = "void"/>
if (currtop <= currscroll.toplimit || currtop <0) {// верхний предел
currtop = currscroll.toplimit;
} else if (currtop> = currscroll.bottomlimit) {// нижний предел
currtop = currscroll.bottomlimit;
}
// Эффект смещения прокрутки
currscroll.scrollul.style.top = currtop + 'px';
var tepseptop = parseint (currscroll.context.style.top? currscroll.context.style.top: 0);
// отладка кода
// document.getElementById ('posationInfo'). innerhtml = 'curtop:' + currtop + 'scrolling cardinality:' + currscroll.scrollradix + 'bottomlimit:' + currscroll.bottomlimit + 'endtop:' + currscrol. currtop + "offsettop:" + currscroll.scrollul.offsettop + "Compute:" + (currtop * currscroll.scrollradix * -1) + 'px';
// Текстовый код
// Прокрутка контента: текущий топ с полосы прокрутки* Cardinality берет отрицательное число
currscroll.context.style.top = currtop * currscroll.scrollradix * -1 + 'px';
};
вернуть currscroll;
};
};
linkflyscroll.prototype.init.prototype.change = function () {
/// <summary>
/// 1: изменение функции содержимого прокрутки
/// 1.1 - изменение () - Эта функция представляет данные, которые обновляют этот объект прокрутки. В некоторых случаях данные контента постоянно меняются. Вы можете вызвать эту функцию, чтобы обновить данные в текущий объект прокрутки.
/// </summary>
/// <return type = "linkflyscroll"/>
/*
* Свойства, содержащиеся в LinkflyScroll, в основном инициализируются или переопределяются в этой функции:
* ISDRAG: Является ли прокрутка
* starttop: (работа)
* Конечный столик: (Работаю)
* TopLimit: верхняя предельная позиция полоса прокрутки
* Bottomlimit: предельное положение в нижней части стержня прокрутки
* Контекст: контент dom
* scrollradix: прокрутка кардинальности
* Цель: контейнер Dom
*/
// сбросить или прочитать серию данных
var curscroll = this;
currscroll.isdrag = false,
currscroll.starttop = 0,
currscroll.endtop = (currscroll.scrollul.style.top?
currscroll.toplimit = currscroll.target.scrolltop,
currscroll.bottomlimit = currscroll.target.clientHeight,
currscroll.scrollradix = 10;
// Получить высоту полосы прокрутки: высота содержания* (высота контейнера/высота содержания = контейнер в процентах от содержания)
var scrollpx = currscroll.target.clientheight * (currscroll.target.clientheight / currscroll.context.offsetheight);
// Прокрутите высоту бара
currscroll.scrollul.childnodes [1] .style.height = scrollpx + 'px';
if (currscroll.context.clientHeight <= currscroll.target.clientHeight && curscroll.options.auto) {
currscroll.scrollul.style.display = 'none';
} еще {
currscroll.scrollul.style.display = 'block';
// Когда отображается полоса прокрутки, исправьте данные максимальной позиции
currscroll.bottomlimit -= currscroll.scrollul.offsetheight;
}
// Установите прокрутку кардинальности стержня прокрутки (стержень прокрутки не прокрутки 1PX -контента Pixel): (Высота содержимого - высота контейнера [потому что текущий контейнер был отображен для одного экрана])/Верх
currscroll.scrollradix = (currscroll.context.offsetheight - currscroll.target.clientheight) / currscroll.bottomlimit;
вернуть currscroll;
};
linkflyscroll.prototype.init.prototype.roll = function (value) {
/// <summary>
/// 1: метод смещения прокрутки
/// 1,1 - Roll (значение) - метод прокрутки стержней прокрутки
/// </summary>
/// <param name = "value" type = "int">
/// процент целей прокрутки
/// </param>
/// <return type = "linkflyscroll"/>
var curscroll = this;
if (typeof (value)! == 'number') {
вернуть currscroll;
}
var currtop = (currscroll.bottomlimit - currscroll.toplimit) * значение / 100;
currscroll.scrollevent (curtpop);
currscroll.endtop = currtop;
вернуть currscroll;
};
/*
* Инструменты
*/
var tool = {
setClass: function (element, classname) {
/// <summary>
/// 1: установите атрибут класса узла элемента
/// 1.1 - setClass (element, classname) - Установите атрибут класса узла элемента. Если такого узла нет, создайте узел и верните измененный объект узла
/// </summary>
/// <param name = "element" type = "element или string">
/// Создать узел, передавая строку, в противном случае изменить узел
/// </param>
/// <param name = "classname" type = "string">
/// Имя класса
/// </param>
/// <return type = "element"/>
if (typeof element === 'string') {
element = document.createElement (element);
}
element.classname = classname;
возвратный элемент;
},
hasclass: function (element, classname) {
/// <summary>
/// 1: Определите, имеет ли элемент класс
/// 1.1 - hasclass (element, classname) - определяет, имеет ли элемент класс, исключения в бизнесе (в основном такая ситуация не происходит), а класс имеет истинную, в противном случае он возвращает ложь
/// </summary>
/// <param name = "element" type = "element или string">
/// Объект узла
/// </param>
/// <param name = "classname" type = "string">
/// Имя класса
/// </param>
/// <return type = "element"/>
if (! element || element.nodetype! == 1) // Пусть исключение проходит, и обработка не выполняется снаружи
вернуть истину;
var ElementClassName = element.ClassName;
if (elementClassname.length <1) {
вернуть ложь;
}
if (elementClassName == classname || elementClassname.match (new Regexp ("(^| // s)" + classname + "(// s | $)"))) {
вернуть истину;
}
вернуть ложь;
},
addClass: function (element, classname) {
/// <summary>
//// 1: [добавить] класс для элемента
/// 1.1 - AddClass (элемент, классная имени) - Добавьте к элементу и верните модифицированный класс
/// </summary>
/// <param name = "element" type = "element или string">
/// Объект узла
/// </param>
/// <param name = "classname" type = "string">
/// Имя класса
/// </param>
/// <return type = "element"/>
if (! tool.hasclass (element, classname)) {
if (element.classname.length <1) {
element.classname = classname;
} еще {
element.classname + = '' + classname;
}
}
возвратный элемент;
},
removeClass: function (element, classname) {
/// <summary>
/// 1: удалить класс для элемента
/// 1.1 - AddClass (элемент, классная именная) - удалить класс для элемента и вернуть модифицированный класс
/// </summary>
/// <param name = "element" type = "element или string">
/// Объект узла
/// </param>
/// <param name = "classname" type = "string">
/// Имя класса
/// </param>
/// <return type = "element"/>
if (tool.hasclass (element, classname)) {
var reg = new Regexp ("(^| // s)" + classname + "(// s | $)");
element.classname = element.classname.replace (reg, '');
}
возвратный элемент;
},
css: function (element, key) {
/// <summary>
//// 1: Получить значение атрибута, указанное элементом CSS
/// 1.1 - CSS (элемент, ClassName) - Получить значение атрибута, указанное элементом CSS
/// </summary>
/// <param name = "element" type = "element или string">
/// Объект узла
/// </param>
/// <param name = "key" type = "string">
/// атрибут CSS для получения
/// </param>
/// <return type = "string"/>
return element.currentStyle? element.currentStyle [key]: document.defaultView.getComputEdStyle (element, false) [Key];
},
addEvent: function (element, type, fn) {
/// <summary>
/// 1: добавление событий к элементам
/// 1.1 - CSS (элемент, тип, FN) - Добавить события к элементу, этот пункт к источнику события в функции
/// </summary>
/// <param name = "element" type = "element или string">
/// Объект узла
/// </param>
/// <param name = "type" type = "string">
/// Приложение имя события, без символов на
/// </param>
/// <param name = "fn" type = "function">
/// Объект события
/// </param>
/// <return type = "void"/>
if (element.attachevent) {
элемент ['e' + type + fn] = fn;
element [type + fn] = function () {element ['e' + type + fn] (window.event); }
element.attachevent ('on' + type, element [type + fn]);
} else if (element.addeventListener) {
element.addeventListener (type, fn, false);
}
},
// removeEvent: function (element, type, fn) {
// /// <summary>
// /// 1: удалить события для элементов, эта функция не была использована
// /// 1.1 - removeEvent (element, type, fn) - удалить событие для элемента
// /// </summary>
// /// <param name = "element" type = "element или string">
// /// Объект узла
// /// </param>
// /// <param name = "type" type = "string">
// /// Удаленное имя события
// /// </param>
// /// <param name = "key" type = "string">
// /// Имя функции удаленного события
// /// </param>
// /// <return type = "void"/>
// if (element.detachevent) {
// element.detachevent ('on' + type, element [type + fn]);
// element [type + fn] = null;
//} else if (element.removeeventListener) {
// element.removeeventListener (type, fn, false);
//}
//},
AddCrolleVent: function (element, fn) {
/// <summary>
/// 1: Приложение события Scrollevent
/// 1.1 - AddCrolleVent (Element, FN) - Добавьте событие Scollevent к элементу (специальное событие, событие прокрутки колес на мыши на элементе)
/// </summary>
/// <param name = "element" type = "element или string">
/// Узел элемента
/// </param>
/// <param name = "fn" type = "function">
/// Метод события
/// </param>
/// <return type = "void"/>
var bindScrollfn = function (e) {
E = E || window.event;
// Судить направление прокрутки колеса прокрутки: Firefox отличается от других браузеров
E.Wheel = (E.Wheeldelta? E.Wheeldelta: -e.detail)> 0? 1: -1; // Судить колесо мыши, перевернутое этим событием, 1 -вверх, а -1 находится вниз
// заблокировать поведение по умолчанию браузера
if (e.preventdefault) {// ff
e.preventdefault ();
} еще {
E. ReturnValue = false; // т.е.
}
fn.call (element, e);
}
if (document.addeventlistener) {
// ff
element.addeventListener ('dommousescroll', bindscrollfn, false);
// w3c
element.AddeventListener ('мышиное колесо, BindScrollfn, false);
} else // т.е.
{
element.attachevent ('onmousewheel', bindscrollfn);
}
},
getEvent: function () {
/// <summary>
/// 1: Получить объект события
/// 1.1 - getevent () - Получить объект события без параметров, в то время как совместимости обрабатывают IE и FF
/// </summary>
/// <return type = "event"/>
if (document.all) {
return window.event;
}
func = getevent.caller;
while (func! = null) {
var arg0 = func.arguments [0];
if (arg0) {
if ((arg0.constructor == event || arg0.constructor == mouseevent) || (typeof (arg0) == "Object" && arg0.preventdefault && arg0.stoppropagation)) {
вернуть arg0;
}
}
func = func.caller;
}
вернуть ноль;
},
getMousePos: function (ev) {
/// <summary>
/// 1: Получить текущие координаты мыши
/// 1.1 - getMousePos (EV) - Получить текущие координаты мыши, обработку совместимости и возвращаемый формат объекта: {x: координаты мыши x, y: координаты мыши y}
/// </summary>
/// <param name = "ev" type = "event">
/// объект события события
/// </param>
/// <return type = "json"/>
if (! ev) {
ev = currscroll.getevent ();
}
if (ev.pagex || ev.pagey) {
возвращаться {
x: ev.pagex,
Y: Ev.Pagey
};
}
if (document.documentelement && document.documentelement.scrolltop) {
возвращаться {
x: ev.clientx + document.documentelement.scrollleft - document.documentelement.clientleft,
y: ev.clienty + document.documentelement.scrolltop - document.documentelement.clienttop
};
}
иначе if (document.body) {
возвращаться {
X: ev.clientx + document.body.scrollleft - document.body.clientleft,
y: ev.clienty + document.body.scrolltop - document.body.clienttop
};
}
},
extend: function (oldobj, newobj) {
/// <summary>
/// 1: объединить два объекта
/// 1.1 - Extend (OldObj, NewObj) - объедините два объекта и верните объединенный объект, реализуя его в клоне, поэтому он не окажет никакого влияния на два объекта
/// </summary>
/// <param name = "oldobj" type = "Object">
/// Объект A, который должен быть объединен, который используется в качестве базового объекта, перезаписывает атрибут того же имени нового объекта в базовый объект
/// </param>
/// <param name = "newobj" type = "Object">
/// Объект B должен быть объединен
/// </param>
/// <return type = "Object"/>
var tempobj = tool.clone (oldobj);
for (var key in newobj) {
if (newobj.hasownproperty (key) &&! tempobj.hashownproperty (key)) {
tempobj [key] = newobj [key];
}
}
вернуть Tempobj;
},
клон: функция (obj) {
/// <summary>
/// 1: клонирование объекта
/// 1.1 - клон (obj) - клонировать объект и вернуть клонированный новый объект. Прототип объекта является клонированным объектом
/// </summary>
/// <param name = "obj" type = "Object">
/// объект клонирования
/// </param>
/// <return type = "Object"/>
Функция Clone () {}
Клон.prototype = obj;
var newobj = new Clone ();
for (var key in newobj) {
if (typeof newobj [key] == "Object") {
newobj [key] = tool.clone (newobj [key]);
}
}
вернуть Newobj;
},
ConvertValue: function (value) {
/// <summary>
/// 1: преобразовать значение в допустимое значение
/// 1.1 - ConvertValue (значение) - преобразовать значение CSS, настроенное JSON в допустимое значение, убедитесь, что значение значения не является «Авто»
/// </summary>
/// <param name = "value" type = "Object">
/// Значение, которое должно быть преобразовано
/// </param>
/// <return type = "Object"/>
var reg =/^/d+$/g;
if (typeof (value) === 'number' || reg.test (value)) {
возвращаемое значение + 'px';
} еще
возвращаемое значение;
}
};
// зарегистрироваться в окно
window.linkflyscroll = linkflyscroll;
// зарегистрироваться в window.so пространство имен
if (! window.so) {
window.so = {};
}
window.so.scroll = window.linkflyscroll;
})(окно);
Пример кода
Кода -копия выглядит следующим образом:
<! 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">
<голова>
<title> </title>
<link href = "linkflyscroll/linkflyrollcss.css" rel = "stylesheet" type = "text/css"/>
<script src = "linkflyscroll/linkflyscroll-1.0.0.js" type = "text/javascript"> </script>
<script type = "text/javascript">
window.onload = function () {
var config = {
Auto: True, // Когда контент не достигнет высоты контейнера, будет автоматически скрыта полоса прокрутки
Высота: '100', // Рабочая высота объекта прокрутки (стержень прокрутки будет отображаться, если он превышает эту высоту), Auto получает текущую высоту объекта
Ширина: 'Auto' // Объект Scrollbar Работая ширина
};
var scollobj = so.scroll ('obj', config);
// scrollobj.change (); // Когда изменяется содержимое прокрутки, дисплей прокрутки необходимо обновить, тогда этот метод вызывается
// scrollobj.roll (значение); // позиционировать полос прокрутки до определенной точки, значение - процент относительно объекта прокрутки
};
</script>
</head>
<тело>
<div id = "obj">
<div>
В настоящее время в области корпоративного управления появляется новый «стиль моды», и некоторые гигантские компании «похудят» для себя и превращаются в более умный и более гибкий бизнес. Понятно, что программное обеспечение Oracle все чаще меняет основные расходы на обслуживание своих клиентов на консультанты и сторонних поставщиков.
«В Китае 90% бизнеса Oracle осуществляется через этих партнеров. Кроме того, для дальнейшего обеспечения доходов Oracle генеральный директор Эллисон также приобрел небольшой остров на Гавайях», - сказал Крейг Гуаранте.
Как глобальный вице -президент, Гуаренте очень хорошо осведомлен о стратегиях Oracle. Guarente имеет 16 -летний опыт работы и имеет богатый опыт управления контрактами, управления лицензиями на программное обеспечение и аудита программного обеспечения. После ухода из Oracle в 2011 году он присоединился к Palisade, чей основной бизнес - помочь клиентам Oracle предоставить контракты с программным обеспечением, вмешательство в аудиторскую службу и лицензию «оптимизация».
Гуаренте сказал, что бизнес Палисада развивается очень быстро. Как сторонняя организация, Palisade помогает клиентам выигрывать большие заказы, потому что они находятся ближе к рынку и могут понимать потребности пользователя более точно.
Вообще говоря, консалтинговые компании помогают клиентам разобраться в своих фактических потребностях и какую ценность может обеспечить само программное обеспечение. Гуаренте дал подробное объяснение через практические операции. Например, «если вы хотите построить новый центр обработки данных, запустите новый план аварийного восстановления, или если вы хотите войти в облако, сторонняя компания сначала разработает карту планирования и, наконец, реализует ее для достижения конечной цели пользователя. Если программное обеспечение развернуто в разных местах на многих серверах, Enterprise потеряет программное обеспечение. Потому что программное обеспечение в Enterprise Rere Legly. Но или на или Oracle. Администраторы базы данных могут диагностировать проблемы с базой данных с помощью отчетов об автоматической нагрузке (AWR).
В последние годы, с ростом волны программного обеспечения, многие компании устанавливают инструменты управления программными активами, чтобы определить, какое программное обеспечение они используют, как долго оно может длиться, и сколько людей в компании используют его. Но старший аналитик руководства Hegedus сказал: «Ни один инструмент не может точно понять корпоративные правила, особенно приложения Oracle по продуктам, и профессиональные сторонние организации не требуются, чтобы помочь пользователям понять правила программного обеспечения».
Итак, как я могу исправить программные приложения Oracle? Президент Oracle Марк Херд заявил на прошлой неделе, что в начале предприятий приложения для предприятий сторонние учреждения должны быть определены как сторонники обслуживания, чтобы компании могли получить бесплатный ремонт патчей и другую поддержку в будущем, а не просто приобретать права на интеллектуальную собственность. Кроме того, предприятия должны эффективно использовать консультанты для поддержки первого шага в контроле затрат при понимании того, какое программное обеспечение использует предприятие и какое соглашение должно включать. Не оставляйте вслепую поставщика программного обеспечения и приобретайте программное обеспечение в соответствии с процессом ваших прогнозов и предположений.
</div>
</div>
</body>
</html>
Выше приведено все содержание этой статьи, и объяснение очень подробно. Надеюсь, вам понравится.