小编she*_*rek的帖子

fancybox2/fancybox导致页面跳转到顶部

我在开发站点上实现了fancybox2.

当我使用fancybox(点击链接等)时,整个html会在它后面移动 - 然后转到顶部.我在另一个演示中工作正常,但是当我将相同的代码拖到这个项目时,它会跳到顶部.不仅有内联div的链接,还有简单的图库.

有没有人经历过这个?

css jquery fancybox-2

104
推荐指数
5
解决办法
8万
查看次数

将 data 属性添加到 Leaflet.js 标记元素

目标:将数据属性添加到 Leaflet.js 标记元素标记

我有一个带有地图和“聚光灯”区域的项目。

地图使用 Leaflet.js 填充了位置

当我点击地图上的图钉时,我想让它的相应图像和信息出现在聚光灯区域。

我做了一个没有地图的初步测试:http : //codepen.io/sheriffderek/pen/yOmjLV 我使用数据属性连接硬币的两侧。(一组数据是PHP吐出来的,地图数据是API ajax调用)

我理所当然地认为添加类或 Id 或数据或 rel 等将是一个可访问的选项。这是它的主要内容:

// Purveyor types - for query endpoints
var bar = 4;
var retailer = 3;

// Create the "map"
var onSiteMap = L.map('on-site-map').setView([34.0758661, -118.25430590], 13);

// Define the pin (no SVG?)
var onSiteIcon = L.divIcon({
  className: 'my-div-icon' // this gets one class name as far as I can tell
});

// Setup map "Look"
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(onSiteMap);

// Grab the data
$.ajax( { …
Run Code Online (Sandbox Code Playgroud)

javascript leaflet

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

jQuery添加类并删除所有其他类

所以我有一些导航锚.我想在点击它们时更改页面上的一些基本配色方案.我能够做到这一点的唯一方法是使用下面的代码.

它工作正常,但我不禁认为有一种更优雅的方式.有人知道是否有可能在一次犯规中脱掉这些课程?

编辑:这可能更清楚了.我不希望原来的课程消失了.我想,只是添加了jQuery的类.对困惑感到抱歉.

谢谢.

编辑:看到这个骗局

试图实施所有解决方案.

得到"{"错误":"请使用POST请求"}"虽然......

编辑:这是因为href ="?" 与指出的href ="#"相对应.

    $(".home").click(function() {
        $(".primary-color").addClass("one");
            $(".primary-color").removeClass("two"); 
            $(".primary-color").removeClass("three");   
            $(".primary-color").removeClass("four");    
            $(".primary-color").removeClass("five");           
    });

    $(".services").click(function() {
        $(".primary-color").addClass("two");
            $(".primary-color").removeClass("one");
            $(".primary-color").removeClass("three");   
            $(".primary-color").removeClass("four");    
            $(".primary-color").removeClass("five");       
    });

    $(".pricing").click(function() {
        $(".primary-color").addClass("three");
            $(".primary-color").removeClass("one");
            $(".primary-color").removeClass("two");     
            $(".primary-color").removeClass("four");    
            $(".primary-color").removeClass("five");       
    });

    $(".special-thing").click(function() {
        $(".primary-color").addClass("four");
            $(".primary-color").removeClass("one");
            $(".primary-color").removeClass("two"); 
            $(".primary-color").removeClass("three");   
            $(".primary-color").removeClass("five");   
    });

    $(".contact").click(function() {
        $(".primary-color").addClass("five");
            $(".primary-color").removeClass("one");
            $(".primary-color").removeClass("two"); 
            $(".primary-color").removeClass("three");   
            $(".primary-color").removeClass("four");     
    });
Run Code Online (Sandbox Code Playgroud)

html css jquery

5
推荐指数
3
解决办法
2万
查看次数

动画高度自动存储高度 - 使用velocity.js进行滑动

我正在尝试制作一个像slideToggle()方法一样的滑动切换淡入淡出动画但是使用velocity.js - 希望它会更顺畅.

因为我无法滚动到自动 - 我将高度放在变量中并使用它来设置动画高度.我遇到的问题是高度值存储一次,如果页面稍微调整大小,那么数字不再正确. - 另外 - 因为该区域在页面加载时隐藏(在它获得初始高度之后)我无法再次检查高度(如果发生窗口调整大小)

最后我想把它放到一个函数中,所以保持相对它的关键.

另外,如果你没有使用velocity.js,它基本上就像.animate() - 所以它并不是问题的一部分.

HTML

<section>
  <div class="button-w">
    <button>Toggle</button>
  </div>

  <div class="box">

    <p>{{content}}</p>

    <div class="button-w">
      <button>Close</button>
    </div>

  </div>
</section>
Run Code Online (Sandbox Code Playgroud)


CSS

.button-w {
  width: 100%;
  float: left;
}

.box {
  width: 100%;
  border: 1px solid lime;
  overflow: hidden;
  color: white;
}
Run Code Online (Sandbox Code Playgroud)


jquery(velocity.js)

var boxxHeight = $('.box').outerHeight();

$('.box').hide();

$('button').on('click', function() {

    var boxx = $('.box');

    if ( boxx.is(":visible") ) {

      boxx.velocity({ opacity: 0, height: 0 }, { display: "none" …
Run Code Online (Sandbox Code Playgroud)

javascript jquery animation velocity.js

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

WordPress json Rest API 获取自定义字段数据

我目前正在使用JSON REST API (WP API)插件来获取我的帖子和页面数据。

我注意到我的自定义字段数据都没有在 json 中返回,并且查看路由,我认为我无法获取这些数据。

通过当前插件有什么想法,或者我如何才能实现这一目标?

api wordpress json

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

Ember CLI - 适用于第三方API的RESTAdapter

我可以使用ic.ajax将数据导入我的应用程序,但似乎我应该使用RESTAdapter.解释如此简化,我不确定在各种情况下该怎么做.这是我认为应该工作的:(和固定装置,本地快递服务器和http-mocks一样)

我将使用tumblr作为示例 - 因为它总是一直是友好的API.

router.js

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {

  // tumblr posts
  this.resource('posts', {
    path: '/tumblr'
  });

});

export default Router;
Run Code Online (Sandbox Code Playgroud)

路线/ post.js

import Ember from 'ember';

export default Ember.Route.extend({

  model: function() {
    return this.store.find('post');
  }

});
Run Code Online (Sandbox Code Playgroud)

所以,据我所知 - find()是一个神奇的 ajax调用...但是如果我想指定jsonp或者其他什么呢?

适配器/ post.js

import DS from 'ember-data';

var tumblrBlogName = 'feministlibraryonwheels'; // friends site
var tumblrApiKey = 'UbB4p0GxqNa6wUa8VwpIdqtywjIiA6vljZXyI9wkx9hnQnAFyk';
var tumblrRequestUrl = 'http://api.tumblr.com/v2/blog/' + …
Run Code Online (Sandbox Code Playgroud)

javascript tumblr ember.js ember-data ember-cli

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

全局更改Ember应用程序名称的综合途径

我使用CLI和2.0构建了一个Ember应用程序 - 它是一个用植物制成的帽子的应用程序,所以我把它命名为"植物帽子".

几个月后,我意识到人们并不喜欢戴头上的植物,所以我把它改成卖"装满虫子的鞋子".我想这次它真的会起飞.

因此,我想重命名应用程序及其中的任何重要部分 - 就好像我从一开始就将它构建为"鞋子与蠕虫".

我采取了哪些步骤以便我不会错过任何内容.

ember.js

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

Flex-box 100vh延伸到了移动safari chrome后面-是否有任何已知的技巧或解决方案

Flex-box 100vh延伸到了移动safari chrome浏览器之后-是否有任何已知的技巧或解决方案?-或者说真的太好了吗?

在此处输入图片说明

我经常想要一个“模式”类型的div封面,或者一个简单的一键式UI屏幕的全屏图像。我使用flex-box的次数越多,我可以依靠的一些旧技术就越少。当达到100%的高度时,我通常会达到以下目的:

html, body {
  height: 100%;
}
Run Code Online (Sandbox Code Playgroud)

HTML和主体没有明确的高度...并且无法真正知道它们的高度。为了告诉任何孩子身高多高,他们需要知道父母的身高。深度嵌套的元素会变得非常混乱。

100vh视口高度可以消除嵌套问题,但在移动浏览器上,如何发挥效果似乎存在意见分歧。在iOS Safari中,vh其区域将位于其底部的插队UI栏下方。居中的元素不会因为居中的偏移而居中显示,并且当您尝试滚动时,所有内容都会弄得一团糟,笨拙并感到折断。

我可以使用modernizr来检查触摸,但这是不希望出现的位置。在某些情况下,我可以为html和body添加100%的类,包括视图嵌套视图,但是当诸如flickity之类的东西注入许多子元素时,或者MVC中有嵌套的视图会生成更多的嵌套元素,告诉一切都为100%高度/触摸并不是一种一致的措施,因为存在触摸台式机等,这确实是不明智的。

.element-with-background-image {
  width: 100%;
  height: 100vh;
  background-image: url(...);
  background-size: cover;
  background-position: center center;
}
Run Code Online (Sandbox Code Playgroud)

感觉就像我们应得的。他们在视口meta-tag上夺走了我们的max。我只想做点不觉得坏的东西。

简单的示例:http : //s.codepen.io/sheriffderek/pen/LWevrx 调试版本(在电话上进行测试):http : //s.codepen.io/sheriffderek/debug/LWevrx

带有滑块的更复杂的示例:http : //codepen.io/sheriffderek/pen/BWJEKJ 调试版本(用于在电话上进行测试):http : //s.codepen.io/sheriffderek/debug/BWJEKJ

制作东西position: fixed;似乎是获得完全覆盖而又不会出现故障的唯一方法(通常直到最近才引起严重故障)

固定位置版本:http : //codepen.io/sheriffderek/pen/XMVQOX 调试版本(以在手机上测试):http : //s.codepen.io/sheriffderek/debug/XMVQOX

固定位置w滑块/需要获取窗口高度并将其添加到所有子窗口中-我已经能够提出的最佳解决方案:http ://codepen.io/sheriffderek/pen/RpxOzM 调试版本(用于在手机上进行测试) :http//s.codepen.io/sheriffderek/debug/RpxOzM

摘要

是不是在这种情况下不能使用100vh吗?我应该将其从工具箱中取出吗?或者-您是否有一套规则或技术可以让我继续生活?

css mobile-safari flexbox viewport-units

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

适当的CSS以确保身体元素填满整个屏幕

我的身体元素有问题.它似乎正在填满100%的屏幕.但是,如果您将浏览器拖动得较小,然后向下滚动 - 主体不会延伸.

将此jsFiddle视为一个主要示例.

html css

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

ember CLI - "找不到守望者,回到NodeWatcher安装文件系统事件"

在使用ember CLI时,我得到了这个:

version: 0.1.5 Could not find watchman, falling back to NodeWatcher for file system events

我真的不在乎它是否使用了守望者或NodeWatcher ...... - 但我不喜欢这个消息 - 我想用ember想要的东西.我用自制软件安装了守望者......但仍然是这个消息.有任何想法吗?

我是带守望者的3.0.0版本 - 和带有余烬的0.1.5版本.

当我 watchman watch ~/sites/mySite

我明白了 dyld: Library not loaded: /usr/local/lib/libpcre.1.dylib Referenced from: /usr/local/bin/watchman Reason: image not found Trace/BPT trap: 5

这是醇 - "酿造物品在非常规点"的问题吗?

ember.js ember-cli watchman

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