Giter Club home page Giter Club logo

trigger's People

Contributors

col0ring avatar dominguitolamo avatar ironkinoko avatar kakachake avatar kohaiy avatar lakejason0 avatar onsummer avatar plainheart avatar stevenlei avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

trigger's Issues

tg-ref与tg-follow

您好,问一下,tg-ref与tg-follow能不能适用于一个子级元素绑定到父级元素的兄弟级元素?

Also mention jsDelivr CDN in the guide

I remember unpkg CDN has a slow speed in the Chinese mainland. So I'd like to suggest also mentioning using the jsDelivr CDN in the guide. Besides the speed, it also supports fetching any public files from the GitHub repository. For example, we can get the latest built files from the default main branch through https://cdn.jsdelivr.net/gh/triggerjs/trigger/dist/bundle.js

Here is the package in the jsDelivr CDN: https://www.jsdelivr.com/package/npm/@triggerjs/trigger

在Vue项目中,路由跳转后失效

你好,我在一个vue项目中的页面A引入后(引入方法为import '@triggerjs/trigger/dist/bundle') ;之后我从页面A路由跳转到页面B,之后再从页面B路由跳转到页面A时,该JS库失效,请问该如何解决?

随机

tg-map能接收一个内容类似函数(参数可以是现在第几步)的字符串用来随机返回一些东西(比如色值)吗

【filter新增平滑参数@有个问题】如果filter和map指定刚好重复的话会返回异常的值

这个功能有个问题,如果filter和map指定刚好重复的话会返回异常的值
例子

  <div
        class="lift-transition-sticky-content"
        tg-from="0"
        tg-to="100"
        tg-edge="cover"
        tg-name="position"
        tg-filter="0,50,100@"
        tg-map="0:50;50:0;100:0"
      ></div>

50-100的值为0,但是最终渲染的会是50,因为map也指定了0的映射值
源码问题在这

export function parseValues() {
 
 if (filter.values.length > 0 && !filter.values.includes(value)) {
      if (filter.mode === 'smooth') {
        let region = calcKeyFrameRegion(mapping, value);
       
        if (region.length) {
          // 这里获取的范围值是 0
          value = calcKeyFrameValue(mapping, value, region);
        } else {
          return;
        }
      } else {
        if (filter.mode === 'exact') {
          element.lastValue = null;
          el.style.removeProperty(name);
        }
        return;
      }
    }
  // 这里会根据value的值重新获取映射导致异常
   if (typeof mapping[value] !== 'undefined') {
      value = mapping[value];
    }

}

Originally posted by @RexYao97 in #28 (comment)

map和filter组合时bug

如下面这个配置,如果滚动速度过快可能导致监听不到map的键值,页面不会发生变化
class="container" tg-name="size" tg-edge="inset" tg-from="14" tg-to="20" tg-step="0.1" tg-filter="15,20" tg-map="15:14;20:25"
sm5a4-est57

在body添加tg-name之后控制台报错

如图:
image
报错:

trigger:5  Uncaught TypeError: Cannot read properties of null (reading 'hasAttribute')
    at trigger:5:6452
    at u (trigger:5:6486)
    at c (trigger:5:6884)
    at trigger:5:9395
    at Array.forEach (<anonymous>)
    at IntersectionObserver.t (trigger:5:9335)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.