`
huttoncs
  • 浏览: 200898 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

页面控制比例条显示(通过两张图片达到的效果)

阅读更多
/**
*控制比例条以及比例显示
*/
function bilv(cell,data){
     var  total = $("#total").val();
     if(total==0){
        total=1;
        }
     var count = data["count"];
     var a = count/total;
     if(a>1){
       a=1;
      }
     var  pic = "<img width='"+148*a+"' height='10' src='../../../res/sites/images/red_precent.gif'><img width='"+148*(1-count/total)+"' height='10' src='../../../res/sites/images/qian_precent.gif'>";
     var  bil ="<a>"+Math.round(a*100)+"%</a>";
    
     cell.html(pic+bil);
}
  • 大小: 233 Bytes
  • 大小: 858 Bytes
分享到:
评论

相关推荐

    JS实现控制图片显示大小的方法【图片等比例缩放功能】

    另外,通过修改AutoResizeImage函数中的逻辑,还可以实现更多灵活的图片缩放控制。比如,可以设置一个布尔值参数来决定是否保持图片的原始宽高比,或者设置一个回调函数,在图片缩放完成后执行特定的操作等。 ...

    js控制图片放大、缩小、按比例显示

    在JavaScript(JS)编程中,控制图片的放大、缩小以及按照比例显示是常见的需求,尤其在网页设计和交互效果中。下面将详细讲解如何利用JavaScript实现这些功能。 1. **图片放大与缩小** - **鼠标滚动事件**:在...

    四张图片轮换显示横幅广告

    在探讨“四张图片轮换显示横幅广告”的JavaScript特效时,我们首先应当明确这是一个典型的网页动态效果案例,旨在通过编程技术实现图像的自动切换,从而达到吸引用户注意力、提升用户体验的目的。以下是对该特效核心...

    多个图片渐变显示效果

    "多个图片渐变显示效果"就是一个典型的JavaScript实现的动态展示技术,它通过编程方式让多张图片轮流、渐变地显示在页面上,为用户提供平滑且引人入胜的视觉体验。这种效果在网站的轮播图、背景动画或者产品展示等...

    设置Word2021页面显示比例的两种方法.docx

    本文将详细介绍在Word 2021中设置页面显示比例的两种方法,以便用户能够根据自己的工作场景快速、准确地调整页面显示,从而提高工作效率。 ### 使用“显示比例”对话框 对于追求精确调整显示比例的用户,Word 2021...

    HTML 页面实现A4纸样式 显示效果

    在网页设计中,有时我们需要创建一个HTML页面,使其在视觉上呈现出类似A4纸张的效果,这在制作电子...通过灵活运用这些技术,你可以创建出具有专业外观的电子文档,无论是在线阅读还是打印输出,都能达到理想的效果。

    android显示多item多图片的viewpager,选中项居中变大,非选中项模糊变小

    模糊度可以通过控制模糊半径来调整,而缩放比例可以通过计算与中心位置的距离来确定。为了平滑过渡,我们可以使用`ObjectAnimator`或`ValueAnimator`来创建动画效果,使得图片的变换过程更自然。 最后,为了保证...

    js按比例缩放图片,不变形,不失真

    "js按比例缩放图片,不变形,不失真"是一个常见的需求,特别是在用户上传图片或者在页面中显示不同尺寸的图片时。传统的做法是直接设定图片的高度或宽度,但这往往会导致图片比例失衡,产生变形和失真的现象。本篇...

    jQuery实现带控制按钮的图片滚动特效(可多个)

    图片滚动特效通常包括两个主要部分:自动滚动和手动控制。自动滚动是通过设置定时器,在一定时间间隔后改变图片的显示状态。手动控制则是通过添加前后箭头或者索引按钮,让用户可以自由地切换图片。 具体实现步骤...

    图片显示特效javascript

    综上所述,JavaScript在图片显示特效方面具有广泛的应用,从简单的图片加载控制到复杂的动画效果,都能实现。开发者可以根据项目需求选择合适的库和方法,以创造丰富的视觉体验。在实际开发中,还需要考虑性能优化,...

    ireport控制分页显示

    在探讨“ireport控制分页显示”的主题时,我们深入解析如何在iReport设计工具中实现每页固定记录条数的分页显示功能。iReport是JasperReports的一部分,一个强大的开源报表工具,广泛用于Java应用程序中生成各种复杂...

    仿 百度 图片滚动浏览效果

    这可能意味着该效果包含了平滑的图片切换、自动播放、手动导航控制以及在用户滚动页面时图片的动态加载等功能。 【标签解析】 "百度 图片 滚动 浏览 效果" 的标签突出了关键点,即该技术着重于图片的滚动浏览,可能...

    百度图片展示js效果

    同时,可以添加关闭按钮和滑动控制,以允许用户在多张图片之间切换。 3. **缩放效果**:用户可以对图片进行放大和缩小操作。这需要监听鼠标滚轮事件或者双击事件,然后调整图片的CSS属性,如width和height。在放大...

    京东页面JS效果实现,js实现导航条控制,很完整

    "京东页面JS效果实现,js实现导航条控制"这个主题聚焦于如何使用JavaScript来创建类似京东网站的导航条交互效果。下面将详细介绍这个知识点,并提供一个具体的实例——"360buyleftmenu_jb51net"。 1. **JavaScript...

    自动化图片比例焦点图.zip

    自动化图片比例焦点图通过计算原始图片的宽高比,然后将其应用到显示的图片容器中,以保持图片的原始比例。 “焦点图”是指一种在页面上显示多张图片并进行切换的交互式组件。用户可以通过点击或滑动来浏览不同的...

    app引导页(背景图片切换加各个页面动画效果)

    在移动应用开发中,app引导...通过巧妙地运用背景图片切换和页面动画效果,可以有效地提升应用的吸引力,引导用户更好地理解和使用应用。在实际开发过程中,结合技术实践和用户反馈,才能打造出既美观又实用的引导页。

    HTML5页面,上下切换页面效果

    通过定义不同的状态,我们可以让页面在切换时平滑过渡,例如使用`transform`属性进行平移(translate)和缩放(scale),以及`opacity`控制透明度,实现类似滑动或淡入淡出的效果。同时,`requestAnimationFrame`...

    Android实现图片左右滑动效果

    ViewPager通常会包裹在一个父布局,如LinearLayout或RelativeLayout中,然后通过设置适配器(PagerAdapter)来提供要显示的页面数据。以下是一个简单的示例: ```xml android:id="@+id/view_pager" android:...

    c#随窗口大小改动,等比例缩放页面所有控件

    在C#编程中,开发Windows桌面应用程序时,我们...总的来说,实现C#中的控件等比例缩放是一项涉及布局管理、控件属性调整和比例计算的任务,通过编写适当的代码,可以创建出响应窗口大小变化且视觉效果良好的应用程序。

    qt各种页面切换动画实现

    通过实现QPropertyAnimation或QSequentialAnimationGroup,可以创建复杂、个性化的页面切换效果。 在描述中提到的"animation"文件,很可能是包含这些动画效果的QML源代码或者示例项目。为了使用这个资源,你需要将...

Global site tag (gtag.js) - Google Analytics