I'm new to the vegas plug-in. I think I've followed the directions correctly.
My script in the :
$.vegas('slideshow', {
delay:5000,
backgrounds:[
{ src:'img/dark1-500.jpg', fade:1500 },
{ src:'img/dark2-500.jpg', fade:1500 },
{ src:'img/dark3-500.jpg', fade:1500 },
{ src:'img/dark4-500.jpg', fade:1500 },
]
})('overlay', {
src:'img/01.png',
opacity:0.5
});
I also have this in CSS:
.vegas-overlay {
background:transparent url(img/01.png);
opacity:0.5;
z-index:-1;
}
Do both overlay declarations need to be there? Is one stepping on the other?
Thanks for any help.
J
I figured this out by deleting one and then the other declaration.
Related
In my copy of Gatsby Netlify CMS starter kit I've made a reusable header.js component (components/header.js) which shows my site logo and nav. Problem is my logo image won't show up, with error TypeError: Cannot read property 'childImageSharp' of null which I interpret to mean I'm querying the image path incorrectly.
I have my logo.gif image in the same components folder, and I also added it to content/assets. My static query, which I gather is specifically for querying in components, looks like this:
<StaticQuery
query={graphql`
query LogoQuery {
logo: file(absolutePath: { regex: "logo.gif" }) {
childImageSharp {
fixed(width: 500, height: 350) {
...GatsbyImageSharpFixed
}
}
}
}
`}
render={data => (
....
<Img fixed={data.logo.childImageSharp.fixed} alt="Home" />
....
I also tried relativePath, to no avail:
query LogoQuery {
logo: file(relativePath: { eq: "assets/logo.gif" }) {
childImageSharp {
fixed(width: 500, height: 350) {
...GatsbyImageSharpFixed
}
}
}
}
`}
Guessing I want absolute path since header will be in post subfolders, doesn't say anything about the 2 options in the docs though. Regardless, neither seem to work. Any guidance greatly appreciated, thanks.
ha it turns out that this just doesn't work for gifs... only jpgs and pngs. Strange!
I have problem with writing average query!
In my Rethink db, i have some documents in one table like this:
document1:
{
a:{
last:3
},
b:{
last:4
},
c:{
last:6
},
}
document2:
{
a:{
last:7
},
b:{
last:9
},
c:{
last:2
},
}
document3:
{
a:{
last:5
},
b:{
last:8
},
c:{
last:4
},
}
I want to get average of last attribute in every object like this:
{
sum_a_last:15,
sum_b_last:21,
sum_c_last:12,
avg_a_last:5,
avg_b_last:7,
avg_c_last:4
}
What is the query to return this result?
I believe what you're looking for is
r.db('dbName').table('tableName').avg((doc) => doc('a')('last'));
If you're trying to dynamically look for the last member for all objects in a doc there will obviously be more work.
https://rethinkdb.com/api/javascript/avg/
I have a this md-dialog https://codepen.io/patapron/pen/oLaxap
<md-button ng-click="answer('not useful')" >
Not Useful
</md-button>
<md-button ng-click="answer('useful')" style="margin-right:20px;" >
Useful
</md-button>
How do to I get remove the md-autofocus from the buttons?
Objetive: Any button must be pre-selected paint in grey.
There is an easier way to do this without having to write a custom directive. Angular Material has the ability to remove autofocus built-in.
In your controller where you are writing the .show function, set the focusOnOpen to false focusOnOpen: false
The documentation explains it here $mdDialog
Here is an example of how mine looks
function deleteMediaDialog() {
var dialogData = {
};
$mdDialog.show({
controller : 'deleteMediaDialogController',
controllerAs : 'vm',
templateUrl : 'app/main/apps/scala-media/dialogs/delete/delete-dialog.html',
parent : angular.element($document.body),
focusOnOpen : false,
clickOutsideToClose: true,
locals : {
dialogData: dialogData
}
});
}
I solved by mysleft. Directive magic
scope.$watch(function () { return ele.attr('class'); }, function () {
if (ele.hasClass('md-focused')) {
ele.removeClass('md-focused');
}
});
Is is possible to for the KendoUI Chart (Area) to have multiple data labels or even a concatenation of two? I need to display both a value and a percentage for each data point. Is this something that would need to be handled on the data source side or is it on the view?
Thanks for any help.
You can use templates to format both labels and tooltips; see labels.template and tooltip.template.
The key is to reference the Property you want using dataItem ex:
dataItem.TotalDollars
template: "${ category } - #= kendo.format('{0:C}', dataItem.TotalDollars)#"
The answer above wont really help unless you have a strong understanding of the Kendo UI framework. I was having a similar issue and before I found my answer I found this question. I circled back because the answer is simple and some simple example code is really simple. Lets save everyone some clicks.
DATA RESPONSE FROM REMOTE DATA (copy and past for local binding):
[
{
"ProgramName":"Amarr Garage Doors",
"PercentageShare":50.12,
"TotalDollars":5440.000000
},
{
"ProgramName":"Monarch Egress Thermal Hinge C",
"PercentageShare":4.64,
"TotalDollars":504.000000
},
{
"ProgramName":"Monarch Egress Window Wells",
"PercentageShare":15.73,
"TotalDollars":1707.000000
},
{
"ProgramName":"Monarch Premier V Egress Windo",
"PercentageShare":16.25,
"TotalDollars":1764.000000
},
{
"ProgramName":"Organized Living Shelftech Ven",
"PercentageShare":13.27,
"TotalDollars":1440.000000
}
]
**Chart Generation Code: **
function createChart() {
$("#SubmissionSummaryByProgramChart").kendoChart({
title: {
text: "Breakdown by Program"
},
legend: {
position: "right"
},
dataSource: {
transport: {
read: {
url: "GetFooData",
dataType: "json",
data: {
Year : 2014,
Quarter : 1,
}
}
}
},
series: [{
type: "pie",
field: "PercentageShare",
categoryField: "ProgramName"
}],
tooltip: {
visible: true,
template: "${ category } - #= kendo.format('{0:C}', dataItem.TotalDollars)#"
}
});
};
$(document).ready(createChart);
I'd like to use the discreteMapper of CytoscapeWeb 2.0 (that is, the jQuery-based CytoscapeWeb) but need some example code showing what exactly I have to do.
I already tried with some code taken from the Flash-based CytoscapeWeb and tried
var entityColorMapper = {
attrName: "etype",
entries: [ { attrValue: "protein", value: "#ff0000" },
{ attrValue: "compound", value: "#00ff00" },
{ attrValue: "group", value: "#0000ff" }
]
};
and then in the "style" structure I have
"node.E": {
fillColor: {
discreteMapper: entityColorMapper
}
}
but this does not seem to work.
It's different in Cytoscape Web 2:
https://github.com/cytoscape/cytoscapeweb/wiki/StyleObject
// example discrete mapper
fillColor: {
defaultValue: "grey",
discreteMapper: {
attr: "type", // field in ele.data() to map to
mapped: {
"foo": "red", // field value : visual property value
"bar": "blue"
}
}
}
You don't really need to use a discrete mapper, since you could be using selectors in your style:
"node[type='foo']": { fillColor: "red", borderColor: "pink" },
"node[type='bar']": { fillColor: "blue" }
It's better to use the second approach, since you can separate the style for [type='blah'] for several visual properties at once (e.g. borderColor), much like CSS.
Remember: Make sure to always work with the latest prerelease version while Cytoscape Web 2 until the first official release is made.
https://github.com/cytoscape/cytoscapeweb/downloads