小编pin*_*nkp的帖子

我已经完成了这方面的优秀文档,这很棒. http://dimsemenov.com/plugins/magnific-popup/documentation.html 我的基本弹出工作正常.

我的问题在于动画.我只是无法让他们工作.抱歉,如果我错过了一些非常基本的东西,但我现在已经花了很长时间,希望有人可以指出我的错误.它目前似乎没有任何褪色.

我已经在codepen上玩了它,并且可以通过删除CSS来重新创建这个问题,所以也许这不是正确的,虽然我知道它是链接,因为它的样式弹出而不是动画.

这是我的HTML:

<div id="Column1"><div id="aboutus" >
<div id="pop" >

    <a href="/stalkseed/assets/Uploads/stalk-seed-about-us.jpg" data-effect="mfp-newspaper" title="" alt="" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('about-us','','/stalkseed/assets/Uploads/aboutus-ovr.jpg',1)"><img src="/stalkseed/assets/Uploads/aboutus.jpg" name="about-us" border="0" id="about-us"/></a>

</div>

来自同一页面的我的JavaScript:

    <script type="text/javascript">//<![CDATA[
$(document).ready(function() {
$('#pop').magnificPopup({
  delegate: 'a',
  type: 'image',
  removalDelay: 500, //delay removal by X to allow out-animation
  callbacks: {
    beforeOpen: function() {
      // just a hack that adds mfp-anim class to markup 
       this.st.image.markup = this.st.image.markup.replace('mfp-figure', 'mfp-figure mfp-with-anim');
       this.st.mainClass = this.st.el.attr('data-effect');
    }
  },
  closeOnContentClick: true,
  midClick: true // allow opening popup on middle mouse …

这是我在这里问的问题的扩展:Owl Carousel 2:过滤项目,但使用Javascript保持排序顺序(希望这没关系).

我有一个过滤项目的菜单.我希望在单击和外部页面链接时应用过滤器.因此,在第X页上,单击FilterA,它会将您定向到页面Y并将项目过滤到FilterA,就像您刚刚单击第Y页上的FilterA一样.

在理想的世界中,它只需使用链接,例如www.example.com/pageY/#filterA.

你可以在这里看到实况页面.

这是过滤功能:

$(document).ready(function () {
function showProjectsbyCatEur(cat) {
    var owl = $(".owl8").data('owlCarousel');

    owl.addItem('<div/>', 0);

    var nb = owl.itemsAmount;
    for (var i = 0; i < (nb - 1); i++) {
        owl.removeItem(1);
    }

    if (cat == 'all8') {
        $('#projects-copy8 .project8').each(function () {
            owl.addItem($(this).clone());
        });
    } else {
        $('#projects-copy8 .project8.' + cat).each(function () {
            owl.addItem($(this).clone());
        });
    }
    owl.removeItem(0);
}
$('.owl8 .project8').clone().appendTo($('#projects-copy8'));
$('#project-terms8 a').click(function (e) {
    e.preventDefault();
    $('#project-terms8 a').removeClass('active');

    cat = $(this).attr('ID');
    $(this).addClass('active');
    showProjectsbyCatEur(cat); …

使用Zoom by Jackmoore:http ://www.jacklmoore.com/zoom/ https://github.com/jackmoore/zoom

我想在触摸设备上使用双击来切换缩放效果.原因是我正在使用的旋转木马(OWL Carousel)用于图像也具有滑动功能,并且通过触摸和拖动图像在触摸设备上进行缩放,这与滑动冲突.

就像topman网站为移动设备做的那样:http://www.topman.com/en/tmuk/product/clothing-140502/mens-blazers-5369753/black-textured-slim-fit-tuxedo-jacket-5390835？ bi = 0&PS = 20

这是JS文件的链接:https://github.com/jackmoore/zoom/blob/master/jquery.zoom.js

我可以通过双击非触摸设备来实现这一点:

if (settings.on === 'toggle') {
                $source.on('dblclick.zoom',
                    function (e) {
                        if (clicked) {
                            stop();
                        } else {
                            start(e);
                        }
                        clicked = !clicked;
                    }
                );

但需要调整触摸设置的代码,我相信改变这一部分:

// Touch fallback
            if (settings.touch) {
                $source
                    .on('touchstart.zoom', function (e) {
                        e.preventDefault();
                        if (touched) {
                            touched = false;
                            stop();
                        } else {
                            touched = true;
                            start( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
                        }
                    })
                    .on('touchmove.zoom', …

我正在GridField为我的页面创建一个与我的has_many关系,DataObjects但在添加数据并保存对象后,它会破坏CMS中的页面.我无法弄清楚为什么或在搜索后找到任何答案.这是错误和我的代码:

[用户错误]未捕获异常:对象 - > __ call():"文件"上不存在'fortemplate'方法

ProductPage.php

class ProductPage extends Page {

    // Contact object's fields
    public static $db = array(
        'ProductPrice' => 'Text',
        'ProductSubTitle' => 'Text',
        'ProductModelNumber' => 'Text',
        'ProductReleaseDate' => 'Date',
        'AudioCode' =>'HTMLText',
        // 'VideoCode' =>'HTMLText',
        'ProductSold' =>'Boolean',
        'NotAvailable' =>'Boolean',
        'LimitedEdition' =>'Boolean',
        'OneOff' =>'Boolean',
        'Discontinued' =>'Boolean',
        'DealerOnly' =>'Boolean',
        'ComingSoon' =>'Boolean'
    );

    // One-to-one relationship with profile picture and contact list page
    public static $has_one = array(
        'ProductImage' => 'Image',
        'ProductDownload' => 'File' …

我正在使用 Isotope 对产品页面进行排序、过滤和搜索。到现在为止还挺好。我被困在几个领域。我无法在网上找到包含我需要的确切功能组合的示例，因此需要一些帮助。

简而言之，我有多个选择下拉过滤产品，选择价格排序顺序和快速搜索输入字段。所有的工作，但我有一些需要的修正。

去做：

过滤后搜索不起作用。我需要它与过滤器一起工作。

在价格选择下拉菜单中添加了按“销售”和“新品”排序的功能。

添加 URL 哈希侦听器以创建用于过滤的链接，即首先排序的 New In 链接。

同位素网站

选择示例

URL 哈希示例

快速搜索示例

我当前用于过滤和排序的 JS：

        $(document).ready(function(){

// quick search regex
var qsRegex;
var filterValue;
// init Isotope
var $grid = $(".grid").isotope({
  itemSelector: ".grid-item",
  layoutMode: "fitRows",
  getSortData: {
    price: '.t-price parseInt',
    category: '[data-category]',
  },
  filter: function() {
    var $this = $(this);
    var searchResult = qsRegex ? $this.text().match(qsRegex) : true;
    var selectResult = filterValue ? $this.is(filterValue) : true;
    return searchResult  && selectResult;
  }
});

      // bind filter …

我正在使用优秀的滑块 OWL Carousel 2。http://www.owlcarousel.owlgraphic.com/

我的问题是该URLhashListener选项仅允许您创建指向特定幻灯片的链接，但不允许用户从当前幻灯片复制 url 链接进行共享。我假设此选项的正确行为是当用户移动到下一张幻灯片时 URL 更新，以便他们可以复制该唯一的 URL。 http://www.owlcarousel.owlgraphic.com/demos/urlhashnav.html

我的猫头鹰代码：

<script type="text/javascript">
  //<![CDATA[
  $(document).ready(function() {
    var owl = $(".owl-carousel");
    owl.owlCarousel({
      smartSpeed:1500,
      items:1,
      lazyLoad:true,
      loop:true,
      URLhashListener:true,
      startPosition: 'URLhash',
      nav: true,
    });
  });
  //]]>
</script>

我在图像标签中使用它data-hash来为每个图像生成哈希 ID，效果很好（您可以链接到特定的幻灯片）。但是，当您单击next并到达下一张幻灯片时，URL 将保留为#HASHID。该链接不再对应于当前幻灯片。

<img id="zm" class="owl-lazy owlimg" data-hash="slideID" data-src="myimagelink.jpg">

这是一个 url 哈希导航工作的实时页面：
http://www.legacyart.pinkpoliceman.com/collections/birds-of-prey/

带哈希：
http ://www.legacyart.pinkpoliceman.com/collections/birds-of-prey/#slide14

我确信这些文档包含了部分答案，但我不确定如何将它们拼凑在一起。http://www.owlcarousel.owlgraphic.com/docs/api-events.html

我一直在阅读有关此文档的文档，但完全感到困惑。安装后，我的mysite / _config.php文件为空。在哪里可以找到该站点的数据库设置，例如用户名，数据库名称和密码？

此处的文档页面：https : //docs.silverstripe.org/en/4/changelogs/4.0.0/#env

我意识到这一点,类似的问题/答案已经存在.但是我现在已经看了很多,只是不确定我做错了什么简单的事情.我只是想掌握这个.我有错误"找不到变量:getElementById"我试着改变脚本和HTML的顺序.我用这个随机方法工作正常从JavaScript数组获取随机项它只是将它应用于src ...

此视频也很有用https://www.youtube.com/watch?v=pqLS4oyJ8cA

这是我的代码:http://jsfiddle.net/udkhpytm/

<div>
<script id="IntroAnimation" type="text/javascript" charset="utf-8" src=""></script>
</div>

<script type="text/javascript">
var my_array = ['FILE1', 'FILE2', 'FILE3'];
var ri = Math.floor(Math.random() * my_array.length); // Random Index position in the array
getElementById("IntroAnimation").src = ri;
</script>

我正在尝试从数组中获取一个随机项,并通过脚本ID将其放在我的脚本的src中.

我正在尝试构建一个菜单,显示1级菜单以及同一导航栏上的2级菜单.这是因为Page 1的所有孩子都需要在顶级菜单中.我可以通过在导航中循环菜单(2)轻松完成此操作,但是如果您在父页面上,则仅显示这些页面.

    <% loop $Menu(2) %>
            <li class="$LinkingMode"><a href="$Link" title="$Title.XML">$MenuTitle.XML</a></li>
        <% end_loop %>
    <% loop $Menu(1) %>
        <li class="$LinkingMode"><a href="$Link" title="$Title.XML">$MenuTitle.XML</a></li>
    <% end_loop %>