小编dar*_*i0h的帖子

这个问题类似于这个问题:放大一个点(使用缩放和平移) 或者甚至是这个:图像缩放以鼠标位置为中心 但我不想在画布上做它而是正常图像(或者更确切地说是图像的容器div).所以缩放应该像谷歌地图一样.我实际上是黑客/增强iDangerous Swiper zoom(http://idangero.us/swiper/),这是我的出发点,这就是我到目前为止所做的:https: //jsfiddle.net/xta2ccdt/3 /

仅使用鼠标滚轮进行缩放.第一次放大时它可以完美地缩放,但我无法弄清楚如何在第一次放大后计算每个缩放.

这是我的代码:JS:

$(document).ready(function(){
    $("#slideContainer").on("mousewheel DOMMouseScroll", function (e) {
    e.preventDefault();
    var delta = e.delta || e.originalEvent.wheelDelta;
    var zoomOut;
    if (delta === undefined) {
      //we are on firefox
      delta = e.originalEvent.detail;
      zoomOut = delta ? delta < 0 : e.originalEvent.deltaY > 0;
      zoomOut = !zoomOut;
    } else {
      zoomOut = delta ? delta < 0 : e.originalEvent.deltaY > 0;
    }
    var touchX = e.type === 'touchend' ? e.changedTouches[0].pageX : …

我有一些路由,每个路由加载3个组件.所有路线上的两个组件都是相同的.当我在这些路径之间移动时,我想传递新数据,在组件的某个init事件上,我想填充该组件的数据,以便在UI上反映出来.此外,我想重新启动正在加载的组件的引导动画.我该怎么做呢 因为现在,我不知道在组件生命周期中我将获取数据并使用这些新数据重新呈现组件.具体来说,在myapps/1和/ newapp /我有一个主视图组件和一个侧边栏组件.在/ newapp/URL中,我希望侧栏上的所有图标都是红色(主视图上没有任何内容已填充),主视图应为空.在myapps/1上我想将数据从服务器加载到主视图中,如果全部填满,我希望侧边栏上的图标为绿色.现在发生了什么我加载myapps/1,单击侧栏中的第二个项目,主视图更改为第二个视图.然后我router.push("/ newapp /);并且侧边栏停留在第二个项目和第二个主视图.所以router.push("/ myapps /");不重新加载我的侧边栏和我的主视图.

编辑:

在这里,您可以看到我的路线,侧边栏和默认值是相同的.

 const routes = [
    {
        path: "/myapps/newproject",
        components: {
            default: ProjectMain,
            "breadcrumbs": BreadcrumbsNewProject,
            "sidebar": SidebarProject
        }
    },
    {
        path: "/myapps/:id",
        components: {
            default: ProjectMain,
            "breadcrumbs": BreadcrumbsCurrentProject,
            "sidebar": SidebarProject
        }
    },
    {
        path: "/myapps/newversion/:id",
        components: {
            default: ProjectMain,
            "breadcrumbs": BreadcrumbsNewVersion,
            "sidebar": SidebarProject
        }
    }
];

这是我的ProjectMain.vue

<template>
    <div class="wrapper wrapper-content">
        <component :is="currentProjectMain"></component>
    </div>
</template>

这是我在index.html中的路由器视图:

<router-view name="sidebar"></router-view>

我在index.html中有另一个,默认的一个:

<router-view></router-view>

当我单击侧栏上的某个项目时,我向ProjectMain发出事件以切换组件.像这样:在补充工具栏中:

eventBus.$emit("currentProjectMainChanged", "appOverview");

要么

eventBus.$emit("currentProjectMainChanged", "appSettings");

而不是ProjectMain:

eventBus.$on("currentProjectMainChanged", function(data){
                if(data === …

是否可以仅启用在Kendo网格中插入新记录,但禁用编辑记录？

我能做的最好的是onDataBound删除JavaScript中的"编辑"按钮.我尝试过设置,Editable(ed => ed.Enabled(false))但在运行时遇到错误.

@(Html.Kendo().Grid(Model)    
    .Name("Grid" + guid)
    .HtmlAttributes(new { style = "margin:20px" })
    .Columns(columns =>
    {
        columns.Bound(p => p.Id).Hidden(true);
        //a few more columns

        columns.Command(command =>
            {
                command.Edit().Text(Resources.KendoEdit).UpdateText(Resources.KendoUpdateText).CancelText(Resources.KendoCancelText);
                command.Destroy().Text(Resources.KendoDestroy);
            }).Title(Resources.KendoCommands).Width(180);

    })
    .ToolBar(toolbar => toolbar.Create().Text(Resources.KendoToolbarCreate))
    .Editable(editable => editable
        //.Enabled(false)
        .Mode(GridEditMode.InLine)
        .DisplayDeleteConfirmation(false)
    )
    .DataSource(dataSource => dataSource
        .Ajax()
        .ServerOperation(false)
        .Events(events => events.Sync("sync").Error("error"))
        .Model(mod => mod
            .Id(p => p.Id)
        )
        .Model(mod => mod
            .Field(p => p.OldRoleId).Editable(false)
        )

        .Read(read => read.Action("ChangeRole_Read", "ChangeRole"))
        .Create(update => update.Action("ChangeRole_Create", "ChangeRole"))
        .Update(update => update.Action("ChangeRole_Update", "ChangeRole"))
        .Destroy(update => update.Action("ChangeRole_Destroy", …

所以我使用css动画和媒体查询为平板电脑制作了两个动画。

动画所做的主要事情是在平板电脑纵向中从顶部到中心以及在平板电脑横向中从左到中心对 div 进行动画处理。

当页面以纵向加载时，它会从顶部到中心正确地设置动画。但是当方向更改为横向时，它会从左到中心开始第二个动画。如果它首先在横向上也是如此。

我想要的是动画在页面加载时只运行一次，而不是在每次方向改变时触发。

最好没有javascript，只有css。

这是它如何工作的一些代码：

@keyframes leftToCenter {
  from {
    margin-left: -100vw;
  }
  to {
    margin-left: 0;
  }
}
@keyframes topToCenter {
  from {
    margin-top: -100vh;
  }
  to {
    margin-top: 0;
  }
}
@media only screen and (orientation: portrait) {
  .div {
    animation-name: topToCenter;
    animation-duration: 1s;
  }
}
@media only screen and (orientation: landscape) {
  .div {
    animation-name: leftToCenter;
    animation-duration: 1s;
  }
}

编辑：

动画不能用 jQuery 来完成，它应该只用 css 动画来完成。这是要求。

另外，动画有点复杂，我只是把它的最简单的版本放在这里。

主要的是它只在页面加载时运行，而不是在方向改变时运行。

一个简单的问题,或者我想.如何禁用kendo mvc网格的客户端验证？我以为会有一个属性:"Enabled","validator"或者我可以设置为false但我什么也找不到.