标签: scroll

为什么CSS属性overflow:scroll;不起作用<td>,虽然overflow:hidden;效果很好？

<table border="1" style="table-layout:fixed; width:100px">
  <tr>
    <td style="overflow:scroll; width:50px;">10000000000000000000000000000000000</td>
    <td>200</td>
    <td>300</td>
  </tr>
</table>

从CSS规范^1,2,我不明白为什么.

我正在使用WPF数据网格,只有我所拥有的修改是:

    <toolkit:DataGridTextColumn.ElementStyle>
       <Style TargetType="TextBlock">
       <Setter Property="TextWrapping" Value="Wrap"/>
      </Style>
    </toolkit:DataGridTextColumn.ElementStyle>

我有这个修改,所以如果单元格内容较长,它们会拉伸行高,不会隐藏任何文本.问题在于DataGrid的滚动行为 - 它在滚动时会跳过整行,如果行高于一行则完全不能正常工作 - 滚动条在滚动时抖动等等.

有没有办法让WPF DataGrid"顺利"滚动而不是逐行滚动？

谢谢

通常:

document.body.addEventListener('touchmove',function(event){event.preventDefault();},false); 

不适合我.我想让我的iPad webapp感觉尽可能本地化.任何答案都表示赞赏.

我的页面布局看起来像这样:

<style type="text/css">
#content-wrap
{
    margin: 0 auto;
    width: 800px;
}
</style>

<div id="content-wrap">
</div>

您会注意到,当垂直滚动条出现时,content-wrap div会将其位置移动一点.一种情况是当浏览器开始逐步渲染页面而不显示垂直滚动条时,则确定需要滚动条,因为内容高于"折叠".这将div向左移动约10px.

在不强制浏览器始终显示滚动条的情况下,解决此问题的最佳方法是什么？

我在Nexus 7平板电脑上更新到最新版Chrome for Android并且......

-webkit-overflow-scrolling: touch

......不再有效 此外,以下评估为false:

!!('WebkitOverflowScrolling' in document.documentElement.style)

是否支持从最新版Chrome for Android中删除溢出滚动？是否有可用于最新版本的等效或类似的替代动量滚动机制(不是iScroll等)？

同样,我在我的设备上的Play商店中搜索了Chrome测试版,但搜索结果中没有显示.也许Nexus 7平板电脑不提供测试版？

对此事的任何帮助都非常感谢.谷歌似乎已经从他们的浏览器中移除了这个功能,这令人非常沮丧....

编辑:

详细版本信息:

运行Android 4.2.2版的Nexus 7平板电脑

-webkit-overflow-scrolling: touch;

和

!!('WebkitOverflowScrolling' in document.documentElement.style)

• 在Chrome版本18.0.1025469上运行并评估为true
• 在Chrome版本26.0.1410.58上不起作用并评估为false

我想检测div滚动.这段代码的作用是检测整个窗口滚动:

$(document).ready(function() {
var track_load = 0; //total loaded record group(s)
var loading  = false; //to prevents multipal ajax loads
var total_groups = <?php echo $total_groups; ?>; //total record group(s)

$('#results').load("autoload_process.php", {'group_no':track_load}, function() {track_load++;}); //load first group

$(window).scroll(function() { //detect page scroll

    if($(window).scrollTop() + $(window).height() == $(document).height())  //user scrolled to bottom of the page?
    {

        if(track_load <= total_groups && loading==false) //there's more data to load
        {
            loading = true; //prevent further ajax loading
            $('.animation_image').show(); //show loading image

            //load data from …

我有一个JList很多项目,其中一个被选中.我想滚动到JList此处的所选项目,以便用户可以快速查看选择了哪个项目.

我怎样才能做到这一点？

String[] data = {"one", "two", "three", "four", /* AND A LOT MORE */};
JList dataList = new JList(data);
JScrollPane scrollPane = new JScrollPane(dataList);

我有一个UIScrollView,我希望它能够向两个方向滚动(它目前都有),但一次只能滚动一个.因此,例如,如果您开始水平滚动它,它将不会垂直移动,直到您放开并开始垂直移动它.我怎么能这样做？

我遇到了问题.我有一个无限滚动的指令,我在那里听scroll事件.问题是滚动事件只在我绑定到时触发$window:

angular.element($window).bind('scroll', function () {
  console.log('Gogo!'); //works!
});

element.bind('scroll', function () {
  console.log('Gogo!'); //doesn't work... :(((
});

指令在里面ng-view我找到了这个问题,看起来与我的问题非常相似 - 绑定到ng-view内的指令中的事件不起作用

谁知道怎么解决这个问题？谢谢!

我的指示:

directives.directive('scrolly', function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var raw = element[0];

            element.bind('scroll', function () {
                if (raw.scrollTop + raw.offsetHeight > raw.scrollHeight) {
                    scope.$apply(attrs.scrolly);
                }
            });
        }
    };
});

我的看法:

<ul class="items-wrap" scrolly="showMore()">
   <li class="item" ng-repeat="item in items">{{item.name}}</li>
</ul>

问题:基于iOS7 Safari中主屏幕Web应用程序的给定示例,如何实现永不滚动出视图的固定持久标头,以及在敲击时滚动到视图中的输入字段？

这两个示例有一个区别,一个height=device-height在视口中,另一个没有.

没有设备高度

<meta id="viewport" name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1" />

演示:http://run.plnkr.co/plunks/SU8Csk/

编辑链接:http://plnkr.co/edit/SU8Csk

好处:固定标题在点击字段时不会改变位置/高度.

坏处:用户无法在不手动滚动或按下"下一步"按钮的情况下看不到聚焦的字段.这可能非常繁琐,尤其是如果字段位于不溢出的页面上.

设备高度

<meta id="viewport" name="viewport" content="width=device-width, height=device-height, user-scalable=no, initial-scale=1, minimum-scale=1" />

演示:http://run.plnkr.co/plunks/rPoyaB/

编辑链接:http://plnkr.co/edit/rPoyaB

好处:用户根据需要滚动到焦点字段.

坏处:固定标题完全滚出视图,这需要始终保持在屏幕上.场景是,它将包含一个取消按钮和一个始终可以访问的保存按钮.此外,当字段模糊时,标题本身看起来被压扁,直到用户将其向下滚动到视图中,但如果禁用溢出,则它们甚至无法执行此操作.

丑陋的:在我的非平凡的真实代码中,远离这些简化的例子,有一堆元素绝对位于标题内以创建曲线"标签"效果,这些元素的对齐完全关闭.

您应该能够在iOS7 Safari中打开每个演示URL,添加到主屏幕,然后启动以演示该问题.

解决这个问题的最佳方法是什么？

注意:我知道iOS7 Safari中存在"错误",特别是涉及到主屏幕Web应用程序时,但我相信可能存在与我如何构建页面相关的解决方法.我做了大量的研究(见下文),但我很难找到解决方案.

"固定标题"问题的相关链接: ios7 +中需要固定标题,如何获得固定标题以保持在页面顶部？, 修复了移动safari网站上的文本字段标题, iOS 5固定定位和虚拟键盘, ipad/iphone上固定页眉,页脚和侧栏的问题, CSS"位置:固定;" 在iPad/iPhone上？, 固定在Mobile Safari中的定位,当在Mobile Safari中打开虚拟键盘时, 如何阻止我的固定导航像这样移动？, web应用程序 - 设备高度/键盘问题 …