jQWidgets jqxScrollView forward()方法

以下是关于 jQWidgets jqxScrollView 组件中 forward() 方法的详细攻略。

jQWidgets jqxScrollView forward() 方法

jQWidgets jqxScrollView 组件的 forward() 方法用于向前滚动滚动视。

语法

$('#scrollView').jqxScrollView('forward');

参数

forward() 方法没有参数。

示例

以下两个示例演示如何使用 forward() 方法。

示例 1

$('#scrollView').jqxScrollView('forward');

在示例 1 中,我们使用 forward() 方法向前滚动了滚动视图。

示例 2

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>jQxScrollView Forward Method</title>
    <link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jquery-3.5.1.min.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxcore.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxbuttons.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxscrollview.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#scrollView').jqxScrollView({
                width: 300,
                height: 200,
                showButtons: true,
                slideShow: true,
                theme: 'energyblue'
            });

            $('#forwardButton').click(function () {
                $('#scrollView').jqxScrollView('forward');
            });
        });
    </script>
</head>
<body>
    <div id="scrollView">
        <div><img src="https://jqwidgets.com/public/jqwidgets/styles/images/slider1.jpg" /></div>
        <div><img src="https://jqwidgets.com/public/jqwidgets/styles/images/slider2.jpg" /></div>
        <div><img src="https://jqwidgets.com/public/jqwidgets/styles/images/slider3.jpg" /></div>
        <div><img src="https://jqwidgets.com/public/jqwidgets/styles/images/slider4.jpg" /></div>
    </div>
    <button id="forwardButton">Forward</button>
</body>
</html>

在示例 2 中,我们创建了一个滚动视图和一个按钮,用于向前滚动滚动视图。当用户单击按钮时,forward()将被调,将滚动视图向前滚动。

注意事项

  • forward() 方法用于向前滚动滚动视图。
  • forward() 方法通过 jqScrollView 方法调用。
  • forward() 方法不能与 jqxScrollView 方法一起使用。

总之,forward() 方法用于向前滚动滚动视图。以上两个示例演示了如何使用 forward()。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:jQWidgets jqxScrollView forward()方法 - Python技术站

(0)
上一篇 2023年5月12日
下一篇 2023年5月12日

相关文章

  • jQWidgets jqxTagCloud urlBase属性

    jQWidgets是一个流行的前端UI框架,其中包括了诸多组件。jqxTagCloud是其之一,可以用来生成标签云。其中,urlBase是其一个重要属性,下面就详细介绍一下。 什么是jqxTagCloud? jqxTagCloud是jQWidgets框架中的一个组件,用于在网页上显示标签云,它的形象表现是一些大小、颜色和字体不同的标签,通常应用于文章标签筛选…

    jquery 2023年5月12日
    00
  • jQuery插件Validate实现自定义表单验证

    下面是详细讲解“jQuery插件Validate实现自定义表单验证”的完整攻略。 一、什么是jQuery插件Validate jQuery Validate是一个jQuery表单验证插件,它可以在浏览器端快速实现表单验证功能。它自带多种验证规则,如必填项、邮箱格式、手机号码格式、身份证号码格式等,还可以通过自定义方法来实现其他自定义验证规则。 二、基本使用方…

    jquery 2023年5月27日
    00
  • 如何使用jQuery找到所有具有指定类别的孩子

    要使用jQuery找到所有具有指定类别的孩子,我们可以使用以下步骤: 使用$(“.parent-class”)选择器选择具有指定类别的父元素。 使用.find(“.child-class”)函数查找所有具有指定类别的孩子元素。 以下是两个示例,演示如何使用jQuery找到所有具有指定类别的孩子: 示例1:查找所有具有指定类别的孩子 以下是一个示例,演示如何使…

    jquery 2023年5月9日
    00
  • 简单的代码实现jquery定时器

    当需要在网站中实现定时器(Timeer)功能时,可以使用jQuery的定时器方法“setInterval”实现。该定时器方法可以周期性地调用函数来实现一些需要定期执行的任务。 下面是使用jQuery实现定时器功能的攻略: 1. 引入jQuery库 在网站的head标签中引入jQuery库。 <head> <script src="…

    jquery 2023年5月28日
    00
  • 基于nodejs 的多页面爬虫实例代码

    点此前往基于nodejs的多页面爬虫实例代码。 什么是爬虫? 爬虫是指按照一定的规则自动抓取互联网信息的程序工具。常用于各类搜索引擎、数据采集、研究和分析等方面。 基于nodejs 的多页面爬虫实例代码 本篇文章将为大家介绍一个使用 Node.js 编写的多页面爬虫的实例代码,借助此代码,您可以轻松地抓取网页数据。 前置条件 Node.js NPM 代码文件…

    jquery 2023年5月27日
    00
  • 基于jquery & json的省市区联动代码

    下面是详细讲解“基于jquery & json的省市区联动代码”的完整攻略: 一、前置知识 在学习该省市区联动代码之前,需要了解以下知识: HTML基础语法,如标签、属性、表单等; JavaScript基础知识,如变量、流程控制、函数等; jQuery基础知识,如元素选择器、事件绑定、DOM操作等; JSON数据格式,如键值对、数组等。 二、数据源准…

    jquery 2023年5月28日
    00
  • jQWidgets jqxTimePicker format属性

    以下是关于 jQWidgets jqxTimePicker 组件中 format 属性的详细攻略。 jQWidgets jqxTimePicker format 属性 jQWidgets jqxTimePicker 组件的 format 属性用于设置时间选择器中显示的格式。可以使用该属性设置任何必要的时间格式,例如 “hh:mm tt” 或 “HH:mm:s…

    jquery 2023年5月11日
    00
  • jQWidgets jqxTooltip refresh() 方法

    以下是关于 jQWidgets jqxTooltip 组件中 refresh() 方法的详细攻略。 jQWidgets jqxTooltip refresh() 方法 jQWidgets jqxTooltip 组件的 refresh() 方法用于刷新提示框的内容。可以使用该方法在需要的时候刷新提示框的内容。 语法 $(‘#tooltip’).jqxToolt…

    jquery 2023年5月11日
    00
合作推广
合作推广
分享本页
返回顶部