首页 > 专利 > 上海斐讯数据通信技术有限公司 > 自动轮换图片的方法专利详情

自动轮换图片的方法   0    0

有效专利 查看PDF
专利申请流程有哪些步骤?
专利申请流程图
申请
申请号:指国家知识产权局受理一件专利申请时给予该专利申请的一个标示号码。唯一性原则。
申请日:提出专利申请之日。
2015-11-09
申请公布
申请公布指发明专利申请经初步审查合格后,自申请日(或优先权日)起18个月期满时的公布或根据申请人的请求提前进行的公布。
申请公布号:专利申请过程中,在尚未取得专利授权之前,国家专利局《专利公报》公开专利时的编号。
申请公布日:申请公开的日期,即在专利公报上予以公开的日期。
2016-04-06
授权
授权指对发明专利申请经实质审查没有发现驳回理由,授予发明专利权;或对实用新型或外观设计专利申请经初步审查没有发现驳回理由,授予实用新型专利权或外观设计专利权。
2019-07-02
预估到期
发明专利权的期限为二十年,实用新型专利权期限为十年,外观设计专利权期限为十五年,均自申请日起计算。专利届满后法律终止保护。
2035-11-09
基本信息
有效性 有效专利 专利类型 发明专利
申请号 CN201510759598.7 申请日 2015-11-09
公开/公告号 CN105389365B 公开/公告日 2019-07-02
授权日 2019-07-02 预估到期日 2035-11-09
申请年 2015年 公开/公告年 2019年
缴费截止日 2021-12-09
分类号 G06F16/957 主分类号 G06F16/957
是否联合申请 独立申请 文献类型号 B
独权数量 1 从权数量 0
权利要求数量 1 非专利引证数量 1
引用专利数量 3 被引证专利数量 0
非专利引证 1、dyyaries.Swiper滑动Html5手机浏览器自适应《.http://blog.csdn.net/dyyaries/article/details/46442187》.2015,;
引用专利 CN104021129A、WO2015127882A1、JP2012142784A 被引证专利
专利权维持 5 专利申请国编码 CN
专利事件 转让 事务标签 公开、实质审查、授权、权利转移
申请人信息
申请人 第一申请人
专利权人 上海斐讯数据通信技术有限公司 当前专利权人 湖州爱迪电气有限公司
发明人 黄小飞 第一发明人 黄小飞
地址 上海市松江区思贤路3666号 邮编 201616
申请人数量 1 发明人数量 1
申请人所在省 上海市 申请人所在市 上海市松江区
代理人信息
代理机构
专利代理机构是经省专利管理局审核,国家知识产权局批准设立,可以接受委托人的委托,在委托权限范围内以委托人的名义办理专利申请或其他专利事务的服务机构。
杭州千克知识产权代理有限公司 代理人
专利代理师是代理他人进行专利申请和办理其他专利事务,取得一定资格的人。
周希良
摘要
本发明涉及图片显示领域,尤其涉及一种自动轮换图片的方法。一种自动轮换图片的方法,应用于jQeury Mobile中,所述方法包括:步骤S1,将图片轮换插件提取到jQeury Mobile框架之外,将所述图片轮换插件中的图片从背景中提取;步骤S2,在所述jQeury Mobile框架中留出空白区域;步骤S3,将所述图片轮换插件定位于所述空白区域中;步骤S4,将提取的所述图片宽度设置为100%。
  • 摘要附图
    自动轮换图片的方法
  • 说明书附图:图1
    自动轮换图片的方法
  • 说明书附图:图2
    自动轮换图片的方法
法律状态
序号 法律状态公告日 法律状态 法律状态信息
1 2020-12-25 专利权的转移 登记生效日: 2020.12.14 专利权人由上海斐讯数据通信技术有限公司变更为湖州爱迪电气有限公司 地址由201616 上海市松江区思贤路3666号变更为313023 浙江省湖州市吴兴区埭溪镇上强路
2 2019-07-02 授权
3 2016-04-06 实质审查的生效 IPC(主分类): G06F 17/30 专利申请号: 201510759598.7 申请日: 2015.11.09
4 2016-03-09 公开
权利要求
权利要求书是申请文件最核心的部分,是申请人向国家申请保护他的发明创造及划定保护范围的文件。
1.一种自动轮换图片的方法,其特征在于,应用于jQuery Mobile中,所述方法包括:
步骤S0,在web页面的html部分载入图片轮换插件;
步骤S1,将图片轮换插件提取到jQuery Mobile框架之外,将所述图片轮换插件中的图片从背景中提取;步骤S1具体包括:
步骤S11,将所述html部分提取到jQuery Mobile框架之外;
步骤S12,将所述图片以标签形式显示;
步骤S2,用div标签在所述jQuery Mobile框架中留出空白区域;
步骤S3,采用absolute的样式方法,将所述图片轮换插件定位于使用所述div标签留出的空白区域中;
步骤S4,将提取的所述图片宽度设置为100%;
所述空白区域的高度固定。
说明书

技术领域

[0001] 本发明涉及图片显示领域,尤其涉及一种自动轮换图片的方法。

背景技术

[0002] jQueryMobile为前端开发的一个框架,主要应用于手机端的开发,该框架自带css库及jQuery库,将一个独立的页面分成多个page,在该框架下,自动轮换图片的插件无法获取所需要的width属性,导致多设备多分辨率下该插件无法自适应,jQueryMobile框架中自动轮换图片插件无法自 适应各分辨率屏幕。在载入web页面时 ,使 用document.body.clientWidth方法,获取浏览器的当前宽度,赋值给轮换图片,该方法只能在第一次载入web页面时生效,在不刷新web页面时无法重新获取浏览器的宽度,导致在最大化/最小化PC端浏览器或者切换手机横屏/竖屏时,图片宽度无法自适应。

发明内容

[0003] 针对现有技术中存在的问题,本发明提供了一种自动轮换图片的方法,能够提高图片在电子设备中显示的清晰度。
[0004] 本发明采用如下技术方案:
[0005] 一种自动轮换图片的方法,应用于jQuery Mobile中,所述方法包括:
[0006] 步骤S1,将图片轮换插件提取到jQuery Mobile框架之外,将所述图片轮换插件中的图片从背景中提取;
[0007] 步骤S2,在所述jQuery Mobile框架中留出空白区域;
[0008] 步骤S3,将所述图片轮换插件定位于所述空白区域中;
[0009] 步骤S4,将提取的所述图片宽度设置为100%。
[0010] 优选的,所述方法还包括:
[0011] 步骤S0,于所述步骤S1之前,在web页面的html部分载入所述图片轮换插件。
[0012] 优选的,所述步骤S1具体包括:
[0013] 步骤S11,将所述html部分提取到jQuery Mobile框架之外。
[0014] 优选的,所述步骤S1还包括:
[0015] 步骤S12,将所述图片以标签形式显示。
[0016] 优选的,所述步骤S2具体包括:
[0017] 步骤S21,用div标签在所述jQuery Mobile框架中留出空白区域。
[0018] 优选的,所述步骤S3具体包括:
[0019] 步骤S31,将所述图片轮换插件定位于使用所述div标签留出的空白区域中。
[0020] 优选的,所述步骤S31具体包括:
[0021] 步骤S311,采用absolute的样式方法,将所述图片轮换插件定位于使用所述div标签留出的空白区域中。
[0022] 优选的,所述方法中,
[0023] 所述空白区域的高度固定。
[0024] 本发明的有益效果是:
[0025] 本发明设计的轮换图片的兼容性较好,能够自适应所有的终端设备,包括PC和移动端;可以自适应所有的浏览器。并且能够实现jQueryMobile框架中轮换图片插件中图片的自适应屏幕效果。

实施方案

[0028] 需要说明的是,在不冲突的情况下,下述技术方案,技术特征之间可以相互组合。
[0029] 下面结合附图对本发明的具体实施方式作进一步的说明:
[0030] 如图1所示,一种自动轮换图片的方法,应用于jQuery Mobile中,所述方法包括:
[0031] 步骤S1,将图片轮换插件提取到jQuery Mobile框架之外,将所述图片轮换插件中的图片从背景中提取;
[0032] 步骤S2,在所述jQuery Mobile框架中留出空白区域;
[0033] 步骤S3,将所述图片轮换插件定位于所述空白区域中;
[0034] 步骤S4,将提取的所述图片宽度设置为100%。
[0035] 本发明一个较佳的实施例中,所述方法还包括:
[0036] 步骤S0,于所述步骤S1之前,在web页面的html部分载入所述图片轮换插件。
[0037] 本发明一个较佳的实施例中,所述步骤S1具体包括:
[0038] 步骤S11,将所述html部分提取到jQuery Mobile框架之外。
[0039] 本发明一个较佳的实施例中,所述步骤S1还包括:
[0040] 步骤S12,将所述图片以标签形式显示。
[0041] 本发明一个较佳的实施例中,所述步骤S2具体包括:
[0042] 步骤S21,用div标签在所述jQuery Mobile框架中留出空白区域。
[0043] 本发明一个较佳的实施例中,所述步骤S3具体包括:
[0044] 步骤S31,将所述图片轮换插件定位于使用所述div标签留出的空白区域中。
[0045] 本发明一个较佳的实施例中,所述步骤S31具体包括:
[0046] 步骤S311,采用absolute的样式方法,将所述图片轮换插件定位于使用所述div标签留出的空白区域中。
[0047] 本发明一个较佳的实施例中,所述方法中,
[0048] 所述空白区域的高度固定。
[0049] 本实施例中,如图2所示,在web页面的html头部载入图片轮换插件swiper.js。将html部分提取到jQueryMobile框架的外面,并将插件中图片从背景提取为使用img标签直接显示。在jQueryMobile框架中用div标签留出固定高度的空白区域。使用position:absolute的样式方法将图片轮换插件定位在jQueryMobile使用div标签所留出的空白区域中。
[0050] 综上所述,本发明将该部分插件提取到jQueryMobile框架以外,使用position:absolute方法将该部分内容定位在web页面的最顶端,并将里面的图片以标签形式展现,而不是背景,标签中的图片只要设置width:100%就可自适应所有浏览器,并在切换浏览器大小时自适应屏幕。
[0051] 通过说明和附图,给出了具体实施方式的特定结构的典型实施例,基于本发明精神,还可作其他的转换。尽管上述发明提出了现有的较佳实施例,然而,这些内容并不作为局限。
[0052] 对于本领域的技术人员而言,阅读上述说明后,各种变化和修正无疑将显而易见。因此,所附的权利要求书应看作是涵盖本发明的真实意图和范围的全部变化和修正。在权利要求书范围内任何和所有等价的范围与内容,都应认为仍属本发明的意图和范围内。

附图说明

[0026] 图1为本发明自动轮换图片的方法的示意图;
[0027] 图2为本发明中jQueryMobile框架在轮换图片的示意图。
版权所有:盲专网 ©2023 zlpt.xyz  蜀ICP备2023003576号