小编Lee*_*eeR的帖子

用以下方法覆盖动画:悬停

我有以下CSS动画:

.border-strobe {
     -webkit-animation: border-strobe-animation 1.5s infinite ease-in-out;
}

@-webkit-keyframes border-strobe-animation {
    0% {border:2px solid #FF1d38;}
    50% {border:2px solid #000000;}
    100% {border:2px solid #FF1d38;}
}
Run Code Online (Sandbox Code Playgroud)

基本上,我想要做的是:

.border-strobe:hover例如,在悬停(so )时,我想将边框颜色更改为#FF1D38.

•一旦我离开悬停,我想简单地让动画运行它是正常的过程.

然而问题是,我在课程的页面上有一些元素.border-strobe,我想及时保留它们.

是否有一种简单的方法可以使用悬停覆盖边框颜色并保持动画彼此一致,或者目前无法执行此操作?

那有意义吗?

css css3 css-animations

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

Webpack4:基于入口点的两个供应商库

所以,我一直在打猎,除非我的搜索技能最近变得更糟,否则我似乎找不到任何东西.但是,我正在寻找的是能够根据入口点生成两个供应商捆绑包.

例如,我有3个入口点:

  • 编辑
  • 上市
  • 验证

当用户登录时,它将包含auth,public和editor包的变体.当用户注销时,它只会加载公共包.这两种情况都会加载供应商捆绑包,但是当我们注销时,我不需要加载编辑器和auth所需的模块,因此希望有一种方法可以将其拆分为供应商和vendor.auth或类似的东西.

我目前唯一的优化代码如下:

optimization: {
    concatenateModules: true,
    splitChunks       : {
        cacheGroups: {
            commons: {
                test     : /[\\/]node_modules[\\/]/,
                name     : 'vendors',
                minChunks: 2,
                chunks   : 'all'
            }
        }
    }
},
Run Code Online (Sandbox Code Playgroud)

这里的任何帮助将不胜感激!

谢谢

javascript optimization webpack-4

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

Vue Composition Reactive 属性未在组件中更新

我正在构建一个通知系统,它有点工作,但有点不。我有以下组合功能

const data = reactive({
    notifications: []
});
let notificationKey = 0;

export const useNotification = () => {
    const visibleNotifications = computed(() => {
        return data.notifications.slice().reverse();
    });

    const add = (notification: INotification) => {
        notification.key  = notificationKey++;
        notification.type = notification.type ?? 'success';

        notification.icon      = iconObject[notification.type];
        notification.iconColor = iconColorObject[notification.type];
        data.notifications.push(notification);

        notificationTimer[notification.key] = new Timer(() => {
            remove(notification.key);
        }, notificationTimeout);
    };

    const remove = (notificationKey: number) => {
        const notificationIndex = data.notifications.findIndex(notification => notification?.key === notificationKey);
        if (notificationTimer[notificationKey] !== undefined) { …
Run Code Online (Sandbox Code Playgroud)

javascript webpack vue.js vuejs2 vue-composition-api

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