小编lha*_*rby的帖子

jquery使用鼠标坐标来偏移'工具提示'样式的悬停功能

我正在尝试创建一个小div,当一个特定元素悬停时出现.我还想使用随客户端移动鼠标而改变的鼠标坐标来偏移div的位置.

我的猜测是计算这个并返回div的新值是昂贵的和耗尽资源看到div的运动错开.

有谁知道如何提高这种方法的效率?

我使用了具有良好跟踪功能的工具提示插件,并且非常顺利地移动了元素.

我的js;

 $(document).ready(function(){
        $('#utilities').mouseover(function(event) { 
            var left = event.pageX - $(this).offset().left + 100;
            var top = event.pageY - $(this).offset().top + 130;
            $('#gas-electric-hover').css({top: top,left: left}).show();
            //console.log (left, top);
        });
        $('#utilities').mouseout(function() {
            $('#gas-electric-hover').hide();
        });
    });
Run Code Online (Sandbox Code Playgroud)

我也创造了这个jsfiddle.事实上,本地代码是惊人的,但是当鼠标进入并离开目标div时,jsfiddle似乎只是更新了coords.

任何帮助非常感谢.

html jquery hover mouseevent coordinates

6
推荐指数
1
解决办法
2万
查看次数

仅知道文件夹路径时,使用javascript/jquery从URL获取当前文件名

我试图从网址获取当前文件名:

$currentFile = window.location.pathname.split("/").pop();
Run Code Online (Sandbox Code Playgroud)

如果完整路径是这样的话,这可以正常工作:

http://www.yoursite.com/folder/index.php
Run Code Online (Sandbox Code Playgroud)

它将返回index.php,index.cfm,index.html等.

但当网址是http://www.yoursite.com/folder/

我无法检索当前文件名,这可能通过js或jquery吗?

javascript jquery filepath pathname

5
推荐指数
1
解决办法
5197
查看次数

当元素可见时(滚动之前)交叉观察器触发

我正在尝试使用 Intersection Observer API。我有一个在第一次迭代中可以工作的函数。基本逻辑是,如果用户向下滚动并从购物篮中添加或删除项目,一旦购物篮再次出现在视图中(因为它位于文档顶部),我就会触发 API 调用。

问题是它不会在滚动之前触发该函数,如果该项目可见或在滚动后再次变得可见(第二部分正在工作),我想触发它

这是原始js:

var observerTargets = document.querySelectorAll('[id^="mini-trolley"]');
var observerOptions = {
    root: null, // null means root is viewport
    rootMargin: '0px',
    threshold: 0.01 // trigger callback when 1% of the element is visible
}
var activeClass = 'active';
var trigger = $('button');
var isCartItemClicked = false;

trigger.on('click', function() {
    isCartItemClicked = true;
});

function observerCallback(entries, observer) { 
    entries.forEach(entry => {
        if(entry.isIntersecting && isCartItemClicked){
            $(observerTargets).removeClass(activeClass);
            $(entry.target).addClass(activeClass);
            isCartItemClicked = false;
            console.log('isCartItemClicked and in view');
            // do my …
Run Code Online (Sandbox Code Playgroud)

javascript intersection-observer webapi

5
推荐指数
1
解决办法
9223
查看次数

cfdirectory根据过滤器输出不同的html

我想根据传递给 cfdirectory 的过滤条件吐出略有不同的 html。

这是我的 cfml:

<cfdirectory
    directory="#dirName#"
    name="fileList"
    action="list"
    type="file"
    filter="*.jpg|*.jpeg|*.png|*.gif|*.mp4"
>
<ul id="content">
    <cfoutput>
        <cfloop query="fileList">
            <cfif filter NEQ '*.mp4'> // I guess this is not possible and is throwing the error
                <li class="content image">
                    <img src="img/#name#" />
                </li>
            </cfif>
            <cfelse>
                <li class="video image">
                    <video controls="controls">
                        <source src="img/#name#" type="video/mp4">
                    </video>
                </li>
            </cfif>
        </cfloop>
    </cfoutput>
</ul>
Run Code Online (Sandbox Code Playgroud)

我认为我不能简单地访问filter内部cfif,但我不确定如何对其进行剥皮。它是否需要存储在循环外的变量中?

非常感谢任何帮助

html coldfusion cfdirectory cfloop cfml

2
推荐指数
1
解决办法
77
查看次数

使用jquery获取行的总和

我正在尝试创建一个简单的totaller,我的基本html看起来像这样:

<ul>
    <li class="header">
        <span>&nbsp;</span>
        ...
        <span>Total</span>
    </li>
    <li>
        <span>0</span>
        <span>1</span>
        <span>2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>
        <span class="total">0</span>
    </li>
    <li>
        <span>1</span>
        <span>10</span>
        <span>20</span>
        <span>30</span>
        <span>40</span>
        <span>50</span>
        <span class="total">0</span>
    </li>
    <li>
        <span>5</span>
        <span>1</span>
        <span>1</span>
        <span>9</span>
        <span>3</span>
        <span>2</span>
        <span class="total">0</span>
    </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

jQuery函数:

var eaList = $('ul li span').not('.total, .header span');
var sum = 0;
eaList.each(function(){
    var total = $(this).parent().find('.total');
    sum += parseFloat($(this).text());
    total.text(sum);
});
Run Code Online (Sandbox Code Playgroud)

这目前累计增加到函数末尾的总数,而不是行.

我希望这是一个简单的选择器的情况var total = $(this).parent().find('.total');(我也尝试过var total = $(this).closest('.total');.

在将.total元素输出到元素之前,是否需要一个空数组来推动总数?或者是否有内置的jquery中的东西应该使用正确的选择器返回总和?

JSFIDDLE:https://jsfiddle.net/lharby/y991hkf6/

javascript jquery sum jquery-selectors dom-node

1
推荐指数
1
解决办法
88
查看次数