我试图在悬停汉堡棒时动画,我在网上找到了一个例子并设法让它在mouseenter上运行,但是我希望它在鼠标离开汉堡栏后返回汉堡栏.
这是代码,因为你可以看到mouseenter工作,但是当我移动鼠标时,我希望它回到汉堡栏并且不能保留为X.
(function() {"use strict";
var toggles = document.querySelectorAll(".c-hamburger");
for (var i = toggles.length - 1; i >= 0; i--) {
var toggle = toggles[i];
toggleHandler(toggle);
};
function toggleHandler(toggle) {
toggle.addEventListener("mouseenter", function(e) {
e.preventDefault();
(this.classList.contains("is-active") === true) ? this.classList.remove("is-active"): this.classList.add("is-active");
});
}
})();Run Code Online (Sandbox Code Playgroud)
.c-hamburger {
display: block;
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
width: 66px;
height: 55px;
font-size: 0;
text-indent: -9999px;
appearance: none;
box-shadow: none;
border-radius: none;
border: none;
cursor: pointer;
transition: background 0.3s;
}
.c-hamburger:focus {
outline: …Run Code Online (Sandbox Code Playgroud)我一直在使用Primefaces很难,所以SO是我找到问题答案的最佳位置.
我有p:dataTable很多列,所以每个列都应该有很短的宽度.对于标题,它们似乎没问题,但对于数据列,它们会分为2行或更多行,这是我不喜欢的.
我将第一列的宽度设置得更大,以显示数据表中的内容.标题文本很好,保持单行.但数据列对我不利.我更喜欢他们保持单线.我不希望换行.椭圆是优选的,但不是强制性的.
<p:dataTable id="searchResultTable" var="searchData" value="#{registerBean.searchDataList}"
scrollHeight="200"
rowIndexVar="rowIndex"
rowKey="#{searchData.model}"
selectionMode="single"
selection="#{registerBean.selectedSearchData}"
paginator="true" rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,20" resizableColumns="true">
<p:ajax event="rowSelect" listener="#{registerBean.onSelectedSearchData}"/>
<p:column headerText="#{registerBean.getSearchResultHeaderText(0)}"
width="30" style="height: 10px; font-size: 8pt;">
<h:outputText value="#{registerBean.getSearchResultText(rowIndex,0)}" />
</p:column>
<p:column headerText="#{registerBean.getSearchResultHeaderText(1)}"
width="30" style="10px; height: 10px; font-size: 8pt;">
<h:outputText value="#{registerBean.getSearchResultText(rowIndex,1)}" />
</p:column>
<p:column headerText="#{registerBean.getSearchResultHeaderText(2)}"
width="30" style="10px; height: 10px; font-size: 8pt;">
<h:outputText value="#{registerBean.getSearchResultText(rowIndex,2)}" />
</p:column>
Run Code Online (Sandbox Code Playgroud)
我用于h:outputText每一列.我不坚持h:outputText,我可以使用Primefaces的任何组件都可以.
提前致谢.
我在让工作服上班时遇到问题.我在这里创建了一个简单的项目.
它似乎正在正确地输出报告,但我肯定错过了某个地方,因为工作服不会看到我的设置.没有分支显示,它只是给出了如何设置它的说明.我试图复制qunit正在做什么,因为他们显然有它的工作.
这是我到目前为止所做的.
创建了使用node/grunt/qunit以及工作服帐户并在项目上切换的项目.我已经用这个替换了部分中的qunit引用.devDependenciespackage.json
"grunt-coveralls": "0.3.0",
"grunt-qunit-istanbul": "^0.4.0"
Run Code Online (Sandbox Code Playgroud)
我已将此添加到我的package.json.
"scripts": {
"ci": "grunt && grunt coveralls"
}
Run Code Online (Sandbox Code Playgroud)
我已经添加了这个配置对于qunit我的Gruntfile.js.
options: {
timeout: 30000,
"--web-security": "no",
coverage: {
src: [ "src/<%= pkg.name %>.js" ],
instrumentedFiles: "temp/",
coberturaReport: "report/",
htmlReport: "build/report/coverage",
lcovReport: "build/report/lcov",
linesThresholdPct: 70
}
},
Run Code Online (Sandbox Code Playgroud)
然后我把它添加到我的.travis.yml.
language: node_js
node_js:
- "0.10"
before_install:
npm install -g grunt-cli
install:
npm install
before_script:
grunt
after_script:
npm run-script coveralls
Run Code Online (Sandbox Code Playgroud) 我已经在一些答案中看到了Graph API接受<center></center>而不是<br>其API的其他部分似乎接受了\r\n.
目前是否有任何方式发送换行符,如果它有记录的位置?
我看了他们的"入门指南",但它并没有出现在任何地方.
在PAGE中而不是devtools本身的Javascript中,当前是否有一种方法可以确定Chrome的devtools是否使用暗模式而不是“正常模式”?
我确实发现了一个带有此注释的错误报告,但看起来仅与Chrome扩展有关。
目前,当您将鼠标悬停时,旋转木马会停止,我已添加,autoplayHoverPause:false但似乎没有任何改变.是否还有其他选项可以阻止它在徘徊时停止?
$('.owl-carousel').owlCarousel({
autoplayHoverPause:false,
loop:true,
margin:0,
nav:true,
responsive:{
0:{
items:1
},
600:{
items:2
},
1000:{
items:4
}
}
});
Run Code Online (Sandbox Code Playgroud) 我正在使用d3构建时间轴可视化,其中域可以从几天到几十年不等.我正在使用d3时标和轴这样:
var timeScale = d3.time.scale()
.domain([firstEvent, lastEvent])
.range([leftPadding, w - rightPadding]);
var timeAxis = d3.svg.axis()
.scale(timeScale)
.orient("bottom");
timeAxis.ticks(5);
Run Code Online (Sandbox Code Playgroud)
由于域是如此可变,因此使用方便ticks(x),将自动选择刻度格式.我的问题是,在某些情况下,未显示年份,这是至关重要的.我的想法是在创建轴后检查刻度线格式,如果它不包含年份,则在轴旁边手动显示.但是,我无法获得比例尺的刻度格式; 使用timeScale.tickFormat()只返回一个函数.我怎么解决这个问题?
我在Webpack上有一个项目,我正在尝试设置SASS进行转换.我相信我非常接近,虽然我的配置存在问题(这里的代码和详细信息).
使用代码运行webpack会产生以下错误:
/foobar/src/js/components/App.jsx
6:8 error Unable to resolve path to module '../../scss/components/app' import/no-unresolved
Run Code Online (Sandbox Code Playgroud)
在花了一段时间这一点,我注意到,如果我取代了import 'scss/components/app'线App.jsx与import '../../scss/components/app.scss'中,transpilation工作.这让我相信有两个问题:
resolve.rootWebpack配置不起作用,因为相对导入工作,但不是绝对的.resolve.extensionsWebpack配置也没有应用,因为我需要附加.scss文件扩展名以使其正常工作.其他说明:
resolve.root配置设置为数组(即[path.resolve(__dirname, './src')])无济于事.import路径console-loader了undefined.任何帮助将不胜感激,谢谢!
更新:一位朋友刚刚分享了这个问题不是来自sass-loader/等,而是来自eslint.这意味着这个问题的性质将会大不相同(更少的webpack,更多的eslint).
无论如何,我.eslintrc扩展了AirBNB的,我猜我需要根据这个插件的细节修改它.
感兴趣的部分是:
settings:
import/ignore:
- node_modules # mostly CommonJS (ignored by default)
- \.coffee$ # fraught with …Run Code Online (Sandbox Code Playgroud) 例如,我经常看到这个 URL 出现。
https://ghbtns.com/github-btn.html?user=example&repo=card&type=watch&count=true
Run Code Online (Sandbox Code Playgroud)
是&意味着&还是应该/可以将其保留为&?
现在,我正在尝试创建一个网站,该网站显示由我的 NodeJS API 提供的最近的新闻帖子。
我尝试了以下方法:
HTML
<div id="news" class="media" v-for="item in posts">
<div>
<h4 class="media-heading">{{item.title}}</h4>
<p>{{item.msg}}</p>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
Javascript
const news = new Vue({
el: '#news',
data: {
posts: [
{title: 'My First News post', msg: 'This is your fist news!'},
{title: 'Cakes are great food', msg: 'Yummy Yummy Yummy'},
{title: 'How to learnVueJS', msg: 'Start Learning!'},
]
}
})
Run Code Online (Sandbox Code Playgroud)
显然,上面的方法不起作用,因为 Vue 无法渲染多个根元素。
我查了 VueJS 的官方手册,并没有想出一个解决方案。谷歌搜索一段时间后,我明白不可能渲染多个根元素,但是,我还没有想出一个解决方案。
javascript ×4
jquery ×2
ampersand ×1
components ×1
coveralls ×1
css ×1
d3.js ×1
eslint ×1
facebook ×1
html ×1
istanbul ×1
owl-carousel ×1
primefaces ×1
qunit ×1
sass ×1
sliders ×1
url ×1
url-encoding ×1
vuejs2 ×1
webpack ×1