Everything posted by Wynn
-
How do I remove any part of an array then replace it with a variable that I pass into a function?
I agree with the above, it's pretty confusing to have all the links swapped around. Plus the code wont persist between pages so I take it you're planning on using AJAX to load content? Anyway, to answer your question about the nth-child. The selector you pass into jQuery is a String and Strings (prior to ES6) don't take variables. jQuery has a $.eq method http://api.jquery.com/eq/ This selects an element at a specific index and you can pass in a variable; eg. var index = 2; $("li").eq(index);
-
Would I be able to include this functionality into my website?
Because you're using the wrong jQuery methods. $.removeData removes previously stored data on the jQuery object using $.data, not content. https://api.jquery.com/jQuery.removeData/ $.append does what it says, appends content to a selected element. https://api.jquery.com/append/
-
Would I be able to include this functionality into my website?
To stop a setInterval you need to use clearInterval, but you need to name the setInterval so you can reference it. for example: var timer = setInterval(callback, 1000) $('button').on('click', function() { clearInterval(timer) }); In your setInterval you're creating a new date object every second, converting it to a number and then subtracting a start time. That's a whole lot of code when all it's really doing is starting from 0 and increasing by 1000 every second. var elapsedTime = 0; setInterval(function() { elapsedTime += 1000; console.log(elapsedTime) }, 1000) does the same thing but more accurate Converting this into minutes and seconds just takes a little Math (the number 60 comes in useful), have a search on stackoverflow for some examples.
-
Box model - padding-box : Can anyone think of a use case?
It's been removed from the specs, no one used it, only one browser ever implemented it. No longer a thing.
-
Is web development extremely competitive because of nerds?
There are plenty of developers who have or do suffer from mental health issues, bipolar disorder, alcohol / drug addiction, homelessness etc. These things are treatable or least manageable and in no way mean that the person with the illness is unemployable.
-
jQuery no longer needed to be learnt?
I grabbed some stats regarding jQuery. downloads from NPM: 26,079 in the last day 463,725 in the last week 1,986,544 in the last month Sites using jQuery (taken from Libscore and Builtwith) Builtwith knows of 59,985,868 sites using jQuery 7,221 of the top 10K 74,397 of the top 100K 766,312 of the top 1M A handful of these sites: Netflix, airbnb, NYTimes, linkedin, Amazon, Baidu, Twitter, pinterest, Live.com, MSN, instagram, yandex, ebay, tumblr, imgur, stackoverflow, github, whatsapp, dropbox, CNN, Adobe, quora, PayPal, craigslist, ask, walmart, nbcnews, vimeo, apple, reddit, imdb, mozilla, ehow, Huffingtonpost, AOL, forbes, Foxnews, American Express, Samsung, mailchimp, telegraph, Bloomberg. I only checked the first four before posting and they do use jQuery or a custom build of it. I think it's fair to say that jQuery is still relevant and will be for some time.
-
Codeeval challenge
matchLettersToWineName('nanan naan na | anan') // nanan naan na I think names / strings should include all the letters including duplicates. Since CodeEval doesn't support ES6 here's a working ES5 solution (you can place it inside the boilerplate CodeEval provides). // line = 'Chardonnay Sauvignon | ann' var namesIncludeLetters = function(input) { var names = input.split(" | ")[0].split(" "); var letters = input.split(" | ")[1].split(""); var includesEveryLetter = function(str) { return letters.every(function(char) { var index = str.indexOf(char); str = str.replace(char, "_"); return index > -1; }); } return names.filter(includesEveryLetter).join(" ") || 'False'; } console.log(namesIncludeLetters(line)); The difference is it's checking that every letter is included in the string and removes it from the string to make sure it's not matched against recurring letters. ...in ES2016 const namesIncludeLetters = input => { const [names, letters] = input.split(" | "); const includesEveryLetter = str => [...letters].every(char => str.includes(char) && (str = str.replace(char, '_'))); return names.split(" ").filter(includesEveryLetter).join(" ") || 'False'; } console.log(namesIncludeLetters(line));
-
General JavaScript
It's a computed property. By using square brackets we're no longer limited to using strings as object keys, we can use variables and expressions etc.
-
How many H1 tag can be used on a webpage?
A lot of literature on the web was following the spec, but there are currently rewrites of the spec taking place to avoid author confusion. The page linked to in the comments of the article Robert posted demonstrates things clearly. Using multiple H1's essentially flattens the document. https://www.w3.org/wiki/HTML/Usage/Headings/h1only If you read through some of the related links at the bottom of the above page: https://github.com/w3c/html/issues/110 Steve Faulkner states: The same issue links to a rewrite of the Article section of the spec, which states: So apparently we're now advised to have only one H1 tag in the root of the document and subsequent H2 - 6 depending on the nesting of content.
-
Remote server connection in React
What url are you trying? There's nothing wrong with jQuery, SuperAgent or Fetch, they all work as expected. The problem lies with the urls you are using: The first url in this thread is returning JSONP but even if you requested JSON (by using nojsoncallback=1) that Flickr endpoint is not CORS enabled. The second David Walsh url you've tried is not CORS enabled either. The error you've posted above suggests that the response isn't valid JSON. When making cross-origin JSON requests, unless the response has the header "Access-Control-Allow-Origin: *" you will receive an error.
-
How - Grunt Task
>> SyntaxError: Unexpected token : You probably have a typo in your code.
-
Remote server connection in React
...also, the data returned is an object not an array, there is no data[0]. console.log(data) // => Object { title: "LS 2008 Pool", link: "https://www.flickr.com/groups/ls200…", description: "Dette er ei gruppe på Flickr, der a…", modified: "2008-07-31T06:31:53Z", generator: "https://www.flickr.com/", items: Array[20] } so either use the data object itself username: data.title or if you want the first item in data.items const first = data[0]; // <= change this const [first] = data.items; // <= to this
-
Fizzbuzz
You're output needs to be a string not an array, the array is just being used to keep the results of the for loop in, you'll need to join it at the end. console.log(arrline.join(" ")); There's also no need for the && i != 0 in your if statements if you start your for loop from 1 instead of 0, and always use strict equality === rather than == .
-
Fizzbuzz
Robert, that's not what codeeval is asking for. The output is expected to be a string containing all numbers up to and including the last number in the input. The first two numbers in the input string are the divisors for fizz and buzz. eg. // if line = "3 5 15" output = "1 2 F 4 B F 7 8 F B 11 F 13 14 FB" // if line = "2 6 12" output = "1 F 3 F 5 FB 7 F 9 F 11 FB"
-
Fizzbuzz
You need to be creating a string of numbers up to n, with appropriate numbers being replaced with F, B or FB and then console.log the resulting string. You're on the right track. The way you're approaching it you need to create an array to keep the results in, instead of console.log, push the result to the array then after the for loop you can console.log(results.join(" ")). Ideally you should also convert any strings to numbers before performing any math on them. To get the different values from the input string // line = "3 5 25" var arr = line.split(" ").map(Number); // arr = [3,5,25]
-
How to use HOVER using JAVASCRIPT?
There's also mouseenter which behaves a little differently to mouseover. The mouseover event bubbles so it will be triggered when entering the element and any descendants (if hovered over) which may lead to unexpected results depending on the function being called. The mouseenter event will only be triggered once when entering the element no matter what descendants the mouse also enters. Here's a simple demo, but MDN may explain it better. jQuery uses mouseenter for it's hover function.
-
TD Input check
$.val() when applied to a collection will only return the value of the first element. To check all the values you'll have to iterate through each input or filter them. if ($('input:text').filter(function() { return this.value.trim() === ""; }).length > 0) { alert("empty") } else { alert("Not empty") }
-
Input adding to total
querySelectorAll lets you use CSS selectors so you can be more specific, eg. ('input:checked'). Radio and checkboxes are the only inputs that can be checked so your if statement could be removed. You're adding the value of #txt2 to the total on every call, so why not just start the total from that value (or 0 if no value). function check_value(){ var total = parseFloat(document.getElementById("txt2").value) || 0; var controls = document.querySelectorAll('input:checked'); for (var i = 0, l = controls.length; i < l; i++){ total += parseFloat(controls[i].value); } document.getElementById("totalx").innerHTML = total; }
-
What to do to make a website loading faster?
It's also not built with WP
-
Floating & Expanding Div -CSS/HTML
It's a fixed positioned link which is then translated, on it's X axis, off page until it's icon is hovered over. quick examples: left-hand side https://jsfiddle.net/76vdLxos/1 right-hand side https://jsfiddle.net/76vdLxos/
-
General JavaScript
`${this.firstName} ${this.lastName}` Template Literals used for interpolation, its just a string containing values without having to use + to concatenate. `The Year is ${5 * 4}${75 / 5}` // => "The Year is 2015" ["test".toUpperCase()]() Computed properties, the above is the same as TEST(). They're for using the value of a variable, function etc as a key / function name in an object. [this.firstName, this.lastName] = newValue.split(' '); Destructuring Assignment. newValue.split(' ') would produce an array containing values, by reflecting that array on the left hand side you're assigning those values to this.firstname and this.lastname, works with Objects too. In ES5 you'd probably write: var names = newValue.split(" "); this.firstName = names[0]; this.lastName = names[1];
-
Hover Colour Change/Vertical Fade
Not sure the above will work because the anchors are initially set to display none, so they don't have a background position to animate from? You'd be better using keyframes instead. here's your code updated. @keyframes bg-slide { from { background-position: 0 -2em } to { background-position: 0 0 } } #menu label{background:linear-gradient(#D4AF37,#D4AF37)no-repeat #101010 0em -2em;border:1px #151515 solid;border-top-left-radius:2.5px;border-top-right-radius:2.5px;color:white;cursor:default;display:block;font-family:candara;font-size:17px;line-height:34px;text-decoration:none;} #menu a{border-bottom:1px #151515 solid;border-left:1px #151515 solid;border-right:1px #151515 solid;color:white;display:block;font-family:candara;font-size:17px;line-height:34px;text-decoration:none;} #menu ul{display:inline-block;list-style:none;padding:0px;} #menu ul ul{display:none;} #menu li:hover ul{display:inline;} #menu>ul>li{float:left;width:90px;} #menu>ul>li:first-of-type,#menu>ul>li:first-of-type label{border-top-left-radius:6.25px 12.5px;} #menu>ul>li:last-of-type,#menu>ul>li:last-of-type label{border-top-right-radius:6.25px 12.5px;} #menu>ul>li>ul>li>a{background:linear-gradient(#D4AF37,#D4AF37)no-repeat #101010 0em -2em;border-bottom-left-radius:6.25px 12.5px;border-bottom-right-radius:6.25px 12.5px;color:white;} #menu>ul>li:first-of-type>ul>li a{border-bottom-left-radius:6.25px 12.5px;} #menu>ul>li:last-of-type>ul>li a{border-bottom-right-radius:6.25px 12.5px;} #menu li a:hover { animation: bg-slide 0.25s 0.2s forwards } #menu li:hover label { animation: bg-slide 0.25s forwards; color: black } If you want one fluid animation change #menu li a:hover to #menu li:hover a I know. People who still use images for buttons just means a lot more work if changes are needed.
-
Hover Colour Change/Vertical Fade
It's done by hiding a background image using a negative position. Then on hover, transitioning it back to its default 0 0 position. The site you linked to uses a .png image, but you could easily just use a linear gradient. http://jsfiddle.net/cpejstrk/
-
Node/Gulp Help
Are you working on a different machine that this was created on? If so, do you have the required ruby gems installed? Can you post the content of the Jekyll task (./gulp/jekyll.js).
-
Sum input values only if checkbox is checked
The problem is that both your conditionals always return true, you can test this by logging something to the console in your second if statement. So sum will always equal sumCheckbox + sumRadio, however if you only check one type of input the other will return NaN which is why you're getting the error. You'd need to check the length property on the jQuery objects, or use $('input[type=checkbox]).is(':checked').. ..or you could just get rid of the conditionals altogether and just use a default value of 0. $('.signup input').on('change', function () { var sumRadio = parseInt($('input[name="sits_count"]:checked').val()) || 0; var sumCheckbox = parseInt($('input[name="avia-transfer"]:checked').val()) || 0; var sum = sumCheckbox + sumRadio; $('.sum').html('<b>Сумма:</b> ' + sum + ' руб.'); });