相关疑难解决方法(0)

我正在通过AJAX加载元素.只有向下滚动页面时,其中一些才可见.
有什么方法我可以知道一个元素现在是否在页面的可见部分？

我正在构建一个将包含在页面中的工具栏.它将被包括在内的div将默认为display:none.有没有办法我可以在我的工具栏上放置一个事件监听器,以便在它变得可见时进行监听,以便初始化？或者我是否必须从包含页面传递变量？

谢谢

如果DIV元素没有脱离屏幕,我需要检查jQuery.这些元素是可见的,并根据CSS属性显示,但它们可以通过以下方式有意放置在屏幕外:

position: absolute; 
left: -1000px; 
top: -1000px;

我无法使用jQuery :visible选择器,因为该元素的高度和宽度都不为零.

我没有做任何幻想.这个绝对位置放置是我的Ajax框架实现某些小部件的隐藏/显示的方式.

我有两个不同的HTML文件,两个不同的UIWebViews&a UISegmentControl.在segmentChanged,我WebView通过加载HTML文件显示了.两个HTML文件都包含公共部分,只有部分内容被更改.现在我想实现这样的功能,当用户读取section 1.1第一个WebView和点击Segment加载第二个WebView,然后第二个WebView需要scroll达到section 1.1他首先读取的WebView,反之亦然.还有n个部分.我使用了以下javacript,但它需要当前的参数div id.但是scroll,如何让当前可见div id.我给了id每个人div.

function pointInView(id)
{
    var divid = document.getElementById(id);
    divid.scrollIntoView(true);
    return false;
}

有人请帮助我.

我正在尝试实现一个浮动在页面右下角的"go to top"按钮.我可以使用以下代码执行此操作,但我不希望此按钮进入我的页面的页脚.当用户将页面向下滚动到页面底部时,如何阻止它进入页脚并停留在页眉顶部？

CSS

#to-top {
  position: fixed;
  bottom: 10px;
  right: 10px;
  width: 100px;
  padding: 5px;
  border: 1px solid #ccc;
  background: #f7f7f7;
  color: #333;
  text-align: center;
  cursor: pointer;
  display: none;
}

JavaScript的

$(window).scroll(function() {
  if($(this).scrollTop() != 0) {
    $('#to-top').fadeIn(); 
  } else {
    $('#to-top').fadeOut();
  }
});

$('#to-top').click(function() {
  $('body,html').animate({scrollTop:0},"fast");
});

HTML

<div id="to-top">Back to Top</div>

编辑 下面是它应该是什么样子的图.黑色垂直矩形是滚动条."返回顶部"按钮不应进入页脚区域.

这是一个jsfiddle.

请不要标记为重复。它与其他问题相似，但不同，因为我问的是哪里是将代码放在，而不是如何编写。

我有这个代码，并想检测哪个部分在视图中：

export default class Home extends React.Component {
    render() {
        return (
            <React.Fragment>
                <div className="col_first">
                    <Scrollspy id="menu_section"
                               items={['section_1', 'section_2', 'section_3', 'section_4', 'section_5']}
                               currentClassName="is-current" className="c_nav_menu" style={{marginTop: 100}}>
                        <li className="c_nav_menu_item"><a href="#section_1">1</a></li>
                        <li className="c_nav_menu_item"><a href="#section_2">2</a></li>
                        <li className="c_nav_menu_item"><a href="#section_3">3</a></li>
                        <li className="c_nav_menu_item"><a href="#section_4">4</a></li>
                        <li className="c_nav_menu_item"><a href="#section_5">5</a></li>
                    </Scrollspy>

                    <div>
                        <li className="lines_between_1"></li>
                        <li className="lines_between_2"></li>
                        <li className="lines_between_3"></li>
                        <li className="lines_between_4"></li>
                    </div>
                </div>
                <section className="row bg_double">
                    <div className="col-lg-1">
                    </div>
                    <div className="col-lg-11  s_anim">
                        <div className="full_screen" id="section_1">
                            <div className="row full_size">
                                <div className="col-lg-12 center_in_s1">
                                    <h1 className="text_s1 gradient_text">ZdajTo</h1>
                                    <p>korepetycje on-line</p>
                                </div> …