Jump to content

Search the Community

Showing results for tags 'javascript'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








Found 785 results

  1. Sigmahokies

    checkbox and paginate page

    Hi everyone, I'm trying to create the look like "paginate data page", but it is not. I set up the file to insert in website by iframe, but I need to find a way to make clicked data like click the checkbox, then click on next, go to next file in iframe, then come back, stay checked in checkbox. Do you understand what I mean? I'm not fluent in English, my prime is American Sign Language.
  2. Shinori

    Ajax inside of Ajax?

    Hello potential helpers, im currently having issues with firing an ajax request inside of another ajax request. Heres my code: Im not getting "alert(content)" Condition if(shop[1] == "gserver") and if(name.includes(shopname) == true) are definetly true. The function is correctly called as well. No Im not using jquery for reasons. Anyone has an idea why the 2nd requests isnt fired? Is it not waiting for the first one to finish? function initiate_shop_game(shopname) { var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if(this.readyState == 4 && this.status == 200) { var obj = this.responseText; var array = eval("[" + obj + "]"); var r = 1; for(var i = 0; i < array.length; i++) { for(var x = 0; x < array[i].length; x++) { var shop = array[i][x] + ''; shop = shop.split(","); if(shop[1] == "gserver") { var name = shop[2]; var imgname = shop[7] var shopvalues = shop[3].split("{%TEND%}"); var minslots = parseInt(shopvalues[1]); var maxslots = parseInt(shopvalues[2]); var minram= parseInt(shopvalues[3]); var maxram = parseInt(shopvalues[4]); var pricea = (parseFloat(shop[5]) / 30); var priceb = (parseFloat(shop[6] / 30)); var content = [name,imgname,minslots,maxslots,minram,maxram,pricea,priceb]; if(name.includes(shopname) == true) { var div = document.createElement('div'); div.id = name; var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if(xmlhttp.readyState == 4 && xmlhttp.status == 200) { alert(content); }; xmlhttp.open('POST',"/template_shop.php", true); xmlhttp.send(); } } } } } } }; xmlhttp.open('POST',"/get_shop_data.php", true); xmlhttp.send(); }
  3. CONCERN: The following function does what it is suppose to do -- namely, select at random and without duplication a given number of elements from an array of elements. However, I fear that it is hopelessly awkward and would like your professional assessment of its construction. You will likely not find another like it on the internet, but parts of it were obtained therefrom. function selectCubes(gates) { function onlyUnique(value, index, self) { return self.indexOf(value) === index; } var cubes = ['cube_one', 'cube_two', 'cube_three', 'cube_four', 'cube_five', 'cube_six', 'cube_seven']; var selectedCubes = []; var filteredCubes = []; var n = 0; while (n < gates) { selectedCube = cubes[Math.floor(Math.random()*cubes.length)]; selectedCubes.push(selectedCube); if (filteredCubes.length < gates) { var filteredCubes = selectedCubes.filter(onlyUnique); n++; } } return filteredCubes; } console.log('selectCubes(3):' + selectCubes(3)); Please comment and have a great weekend! Roddy
  4. Hi, i make one but it will be many line same, like this with 20. document.getElementById("Test1").value = Dotoff; document.getElementById("Test2").value = Dotoff; document.getElementById("Test3").value = Dotoff; i wonder can it make all id in one? i tried it: document.getElementById("Test1","Test2","Test3").value = Dotoff; but it didn't work well, only Test1 change. some know how make all 20 in one? it can save me lots space/line ;)
  5. Eric_B

    Calling javascript in html

    I'm trying to create a script that contains an if/else statement that uses an outside input to change the color of a box in the html file. Currently I am not seeing any changes, so right now I'm checking if the script is even being noticed and ran. I'll admit that I'm not very good at this, so I apologize if these are really simple problems to fix or that they've been fixed before and I missed it when searching for other posts. If it's the latter, could you send me a link. Placement: Currently the script is inside the a style tag, and both are outside the body. Should I not have it in the style tag? Should I keep it outside of the body? If the issue is placement, where should I place it. Currently the if/else statement is not in a function. Does it need to be in a function? If so, how should I set it up so the function gets called every time, but does nothing until the if condition is met? if I don't need it to be a function to run this, how else can I set it up so it will run? Here's the part of the code that I'm working on, Ignore the contents as all I'm looking for is how to get the script to be noticed and ran. <script= text/javascript> var StopTimePivatic = [[175]]; if (StopTimePivatic != 0){ #b[[141]]{ style.background-color= silver; } } else{ #b80, #b81, #b82, #b83, #b84, #b85, #b86, #b87, #b88, #b89, #b90 { style.background-color = Yellow; style.color = black; } #b0, #b1, #b2, #b3, #b4, #b5, #b6, #b7, #b8, #b9, #b10, #b11, #b12, #b13, #b14, #b15, #b16, #b17, #b18, #b19, #b20, #b21, #b22, #b23, #b24, #b25, #b26, #b27, #b28, #b29, #b30, #b31, #b32, #b33, #b34, #b35, #b36, #b37, #b38, #b39, #b40, #b41, #b42, #b43, #b44, #b45, #b46, #b47, #b48, #b49, #b50, #b51, #b52, #b53, #b54, #b55, #b56, #b57, #b58, #b59, #b60, #b61, #b62, #b63, #b64, #b65, #b66, #b67, #b68, #b69, #b70, #b71, #b72, #b73, #b74, #b75, #b76, #b77, #b78, #b79 { style.background-color = red; } } </script> </style> <body onload="bundle()"> As I said previously, If as similar problem to this has been solved, please let me know where i can find it.
  6. BACKGROUND: Recently I had occasion to make a search on my own website using the Newsletter search engine. What I discovered was the most bizarre of behaviors. I could perform one search in Japanese and then no more. In other languages such as French, German, and English I could perform as many searches as I liked -- even repeating the same words more than once -- and I always I was able to produce the expected result. Mind you, this bizarre one-find-stop--all-further-finds behavior in the Japanese language was not the case when I first installed my search engines. Now, I have checked my PHP error.log file and found nothing related to this problem. I have also checked that the parameter value of the AJAX call is being properly passed; here too there is no unusual behavior. This bizarre behavior was not always the case. It appears to have begun taking place all of its own. Any ideas? Roddy
  7. BACKGROUND: I am baffled by the failure of this code to display "Return User" when the browser page is refreshed or the browser page is closed and then reopened. The vslue of the console.log(localStorage) displays: Storage { return_user: "true", length: 1 } CODE: const output = document.querySelector('.output'); if (typeof localStorage !== "undefined") { var localStorage = window.localStorage; if(localStorage.getItem("return_user")) { output.innerHTML = "Return User"; } else { output.innerHTML = "New User"; localStorage.setItem("return_user", true); console.log(localStorage); } } else { output.innerHTML = "Sorry, local storage is not supported."; } QUESTION: Any ideas? Roddy
  8. I am working on a new website for my wife. I tried to make it mobile responsive by using the w3css collapsible navbar with its accompanying javascript and it was working fine. I later tried to make the navbar sticky to improve on the user experience. On introducing the sticky navbar with its accompanying javascript, it becomes sticky on both desktop and mobile but the menu button on mobile stopped working although it is displayed. file.html
  9. BACKGROUND: I have created two functions of which the return value of one becomes the input value of the other. This other then returns a value that is the desire goal of the two functional procedures. So long as I run these functions separately, they produce the desired output. When I attempt to combine them, however, I inevitably fail. Please find below the successful procedure. I will not bother you with my unsuccessful attempts. INPUT ARRAY: var searchItems = [{category:'Search Podcast',count:'1',target:'キャップチブ'},{category:'Search Newsletter',count:'3',target:'proposition'},{category:'Search Podcast',count:'0',target:'Grammar Captive'},{category:'Search Podcast',count:'1',target:'proposition'},{category:'Search Podcast',count:'1',target:'文法'},{category:'Search Newsletter',count:'1',target:'Grammar Captive'},{category:'Search Podcast',count:'2',target:'proposition'},{category:'Search Podcast',count:'0',target:'Grammar Captive'},{category:'Search Podcast',count:'1',target:'proposition'},{category:'Search Podcast',count:'1',target:'文法'}]; The selectAndList( ) Function function selectAndList(propertyName, inputArr) { var propertyArr = []; inputArr.map(function(item) { propertyArr.push(item[propertyName]); }); return propertyArr; } The countOccurrence( ) Function function countOccurrence(inputArr) { var occurrenceArr = []; var copy = inputArr.slice(0); for (var i = 0; i < inputArr.length; i++) { var myCount = 0; for (var w = 0; w < copy.length; w++) { if (inputArr[i] == copy[w]) { myCount++; delete copy[w]; } } if (myCount > 0) { var a = new Object(); a.value = inputArr[i]; a.count = myCount; occurrenceArr.push(a); } } return occurrenceArr; }; Independent Calls Procedure: var selectedPropertyArr = selectAndList('target', searchItems); var occurrenceArr = countOccurrence(selectedPropertyArr); console.log(occurrenceArr); The result is an array with four objects each containing two properties (count and value) with their respective values. Indeed, it is the desired outcome. QUESTION: How to I combine the above two functions into a single function called countValueFrequency( ) with two arguments including propertyName and inputArr? OK. The following works, but is this the most efficient way of achieving the desired result? function countValueFrequency(propertyName, inputArr) { var propertyArr = []; inputArr.map(function(item) { propertyArr.push(item[propertyName]); }); function countOccurrence(inputArr) { var occurrenceArr = []; var copy = inputArr.slice(0); for (var i = 0; i < inputArr.length; i++) { var myCount = 0; for (var w = 0; w < copy.length; w++) { if (inputArr[i] == copy[w]) { myCount++; delete copy[w]; } } if (myCount > 0) { var a = new Object(); a.value = inputArr[i]; a.count = myCount; occurrenceArr.push(a); } } return occurrenceArr; }; return countOccurrence(propertyArr); } var newSelectedPropertyArr = countValueFrequency('target', searchItems); Roddy
  10. Sigmahokies

    Frame changing by link

    Hi everyone, inside PhpStorm, seem tag of frame has been strike, it might mean it is not support. I want to create like paginate data, but I just want to have page inside frame on page, so I can leave video on left, then other column can be change page by link. Anyone can help? Thanks, Gary
  11. ACKNOWLEDGMENT and RESULTS: Let me begin by announcing my success in having merged Matomo and wordcount2.js into a dynamically loading word cloud that reflects visitor use of Grammar Captive's local search engines. It is a little slow in loading, but unfortunately everything related to Matomo is slow at this point -- this, despite my recent server upgrade that has sped everything up. If you would like to see the result, simply click on the menu option Word Cloud under Visitor Profile in the navigation bar on the Grammar Captive mainpage. And, now back to Javascript. Thank you everyone for your effort. BACKGROUND: In an effort to distinguish between visitor desire and Grammar Captive's ability to meet this desire, I am seeking to create another word cloud that measures only visitor behavior. The aforementioned word cloud reflects a matching of visitor desire with Grammar Captives ability to match it. It is not a true reflection of visitor desire. In order to achieve this latter I must count not the number of hits that visitors receive when they make a search, rather I must count the number of searches for a particular item. In order to do this I found a function on Stack Overflow that will likely be of help, if only I could understand it. The FUNCTION: function checkDuplicateInObject(propertyName, inputArray) { var seenDuplicate = false, testObject = {}; inputArray.map(function(item) { var itemPropertyName = item[propertyName]; if (itemPropertyName in testObject) { testObject[itemPropertyName].duplicate = true; item.duplicate = true; seenDuplicate = true; } else { testObject[itemPropertyName] = item; delete item.duplicate; } }); return seenDuplicate; } MY QUANDARY: The condition of the above function's if-statement appears to be self-defeating. Still, the function works, for I have tested it with my own data. Specifically, the variable testObject appears to contain an undefined object. It would appear then that the condition of the if-statement would always return false. As this is definitely not the case, I am at a loss as to how to interpret the condition. QUESTION: How is it that testObject can be empty and the condition still return true? Roddy
  12. iwato

    Javascript Timing

    DILEMMA: Using Javascript with Matomo to track events is somewhat elusive. This is because the Javascript that communicates with the Matomo application is generally placed on a visitor-friendly, visible HTML document, while the events that one wishes to track are often triggered by Javascript after the page has loaded. QUESTION: In light of the above,. when Javascript is called after a page has loaded is the Javascript that loaded with the page called again? Or, is it only the Javascript that was called after the page has been loaded? Roddy
  13. BACKGROUND: I would like to insert a jQuery UI widget into my code. In order to make the widget work, however, it appears to require a more recent version of jQuery. Should I implement the widget, the HTML in which it resides, the controlling Javascript including the new version of jQuery, as well as the CSS would all be called dynamically when the widget is inserted. My concern is that the new inserted version of jQuery might interfere with the rest of the page not included in the insert. QUESTION: Do I have reason to be concerned? Please explain your answer.
  14. sir/madam, I try to making a project that can "Allow only 3 items to add from one list to another" here IS MY CODE:- HTML CODE:- <!DOCTYPE html> <html> <head> <title>jQuery click UI</title> <meta charset="UTF-8"> <link rel="stylesheet" href="style-click.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script> <script src="click.js"></script> </head> <body> <h1>jQuery click UI</h1> <div id="left"> <h2>Available today</h2> <ul id="available"> <li id='2'>bananas</li> <li id='10'>strawberries</li> <li id='11'>mangoes</li> <li id='12'>raspberries</li> </ul> <div class="instructions" id="instructions-remove"> Click to remove fruits from available list </div> </div> <div id="right"> <h2>Out of stock</h2> <ul id="out-of-stock"> <li id='1'>apples</li> <li id='3'>grapes</li> <li id='4'>pomegranates</li> <li id='5'>pineapples</li> <li id='6'>coconuts</li> <li id='7'>oranges</li> <li id='8'>cherries</li> <li id='9'>kiwi fruit</li> </ul> <div class="instructions" id="instructions-add"> Click to add fruits to available list </div> </div> </html> JS CODE:- $(document).ready(function() { // begin document ready $('#instructions-add').hide(); $('#instructions-remove').hide(); $("ul#available").mouseover(function() { $('#instructions-remove').show(); $('#instructions-add').hide(); }); $("ul#out-of-stock").mouseover(function() { $('#instructions-add').show(); $('#instructions-remove').hide(); }); $(document).on('click', '#available li', function() { // begin left side click var id = $(this).attr('id'); var available = 'no'; $(this).remove(); $("#out-of-stock").append(this); $.ajax({ // begin ajax url: "ajax/click.ajax.php", type: "GET", data: { 'id': id, 'available' : available }, }); // end ajax }); // end left side click $(document).on('click', '#out-of-stock li', function() { // right side click var id = $(this).attr('id'); var available = 'yes'; $(this).remove(); $("#available").append(this); $.ajax({ // begin ajax url: "ajax/click.ajax.php", type: "GET", data: { 'id': id, 'available' : available }, }); // end ajax }); // end right side click $('li').on('mouseover',function() { $(this).css( { 'backgroundColor' : 'black', 'color' : 'white' } ); }).on('mouseout' ,function() { $('li').css( { 'backgroundColor' : '', 'color' : '' } ) }); }); // end document ready Problem occur:- If I click one by one item from "out of stock" list, then it's possible to add more than 3 even all items in the "Available today" list. What I Need:-I need that user can't add more than 3 items in the "Available today" list from "out of stock". PLEASE HELP ME !!!!! THANK YOU !!!!!!
  15. iwato

    A Matter of Scope

    GENERAL QUESTION: Can variables created outside of a function be used within a function without having to read them first as arguments of the function? If so, can a function created within a function use a variable created outside of both functions? CODE var dataString = 'search_input=' + search_letter_input; $.ajax({ type: "POST", url: './...', data: dataString, dataType: 'JSON', statusCode: { 404: function() { alert( "Page not found" ); }}, success: function(jsonData) {...} }); SPECIFIC QUESTION: I would like to use the value of the variable search_letter_input in the success function of the $.ajax( ) method. Is this possible? Roddy
  16. So, I am trying to set up what I am calling a "Guided Tour" which uses CSS tooltips/popups to explain various parts of the page that they are on. I want the "tour" to run automatically, but also give them the ability to pause and continue it at any time, as well as go to the next and previous tip as needed. I'm finding this to be a bit more complex than originally anticipated. Mostly because it seems that using setTimeout() inside a for loop isn't that straight-forward. Let's start with my code: var startG = document.getElementById("startGuide"); var guidetips = []; guidetips[0] = document.getElementById("tip1"); guidetips[1] = document.getElementById("tip2"); guidetips[2] = document.getElementById("tip3"); guidetips[3] = document.getElementById("tip4"); guidetips[4] = document.getElementById("tip5"); guidetips[5] = document.getElementById("tip6"); guidetips[6] = document.getElementById("tip7"); startG.onclick = function(){ guideModal.style.display = "none"; controls.style.display = "block"; runGuideTips(); } function runGuideTips(){ guidetips[0].style.opacity="100"; for(i=0;i<guidetips.length;i++){ if(i === 0){ continue; } setTimeout(toggleTip(i), 3000); } } function toggleTip(i){ return function(){guidetips[i-1].style.opacity="0";guidetips[i+1].style.opacity="100";}; } When the user clicks the button to begin, I have the first tip start out by showing immediately. For that reason, I skip the first iteration. Then, each iteration after I want the prior tip to disappear and the current tip to appear. function toggleTip() was added when I read somewhere that by the time the timeout runs, the for loop is already complete. Their solution was to send the parameter in a function. It does work a little bit better than it was before. What it is doing right now is the first tip shows, then 3 seconds later it disappears and the last tip appears. I get an error in my Console that states: Unable to get property ' style' of undefined or null reference : referring to the function in toggleTip(). The expected result was to go through all 7 guidetips. At the end of the day, I am not certain if I am using the best method to accomplish the end goal that I described. I tried to Google this type of thing because I know I've seen it done before. But I wasn't able to find anything specific on it. So any input or suggestions would be appreciated. :)
  17. Greetings to all the users and administrators of w3scools invisionzone forum. I would love to get some constructive criticism on this web development tutorial site namely webtrickshome. It's been around for slightly more than a year but I redesigned it recently. Any feedback regarding the design and contents would be highly appreciated. Thankyou
  18. I have 3 files: html that is displaying data from json file using AngularJS, json file containing the data, script.js that stores the scripts. HTML file also has a form, from which I want to add data to my json file (onsubmit="insertData()"). insertData function is going to be in script.js I know, I may use .push method for this, but I don't know how to apply to the json file in this case. script.js var prg = angular.module('ajsprogram', []); prg.controller("outercont", function($scope, $http) { //function to display json file information $http.get('airlines.json').success(function(data){ $scope.info = data; $scope.airlineorder = 'airline'; }); }); function newairline(an,hb,ur,cs){ //new function to insert a data } airlines.json [ { "airline" : "British Airways", "hub" : "LHR", "url" : "http://britishairways.com", "callsign":"SPEEDBIRD" }, { "airline" : "Air France", "hub" : "CDG", "url" : "http://airfrance.com", "callsign":"AIRFRANS" }, { "airline" : "Virgin Atlantic", "hub" : "LGW", "url" : "http://virginatlantic.com", "callsign":"VIRGIN" }, { "airline" : "RyanAir", "hub" : "DUB", "url" : "http://ryanair.com", "callsign":"RYANAIR" }, { "airline" : "Emirates", "hub" : "DXB", "url" : "http://emirates.com", "callsign":"EMIRATES" } ]
  19. iwato

    Matomo - A Mixed Blessing?

    BACKGROUND: It would be a long exercise in the grammar of the English language to explain what you can more readily understand by going directly to the relevant pages for which I provide the needed annotation below. gate7.html On this page you will find code that is identical in structure to six other pages similarly organized but with different content called gate1.html, gate2.html, gate3.html, gate4.html, gate5.html, gate6.html. The Javascript on this page and the other aforementioned pages performs two important functions: one, call a jQuery plug-in called $.colorbox that creates a gallery of iframes; and two, send an HTTP request to the Matomo application signalling a change of iframe. In addition, the gallery in question consists of four pages called gate7a.html, gate7b.html, gate7c.html, and gate7d.php. It should be noted that the other aforementioned six pages including gate1.html through gate6.html all perform similar tasks using nearly identical code. What makes gate7.html is the extension of the last iframe that it calls -- namely, gate7d.php. None of the other pages call an iframe with a PHP extension. overview.html After landing on this page you will find in the navigation bar on your left several options under the subheading Visitor Profile. I would like to draw your attention to two of them -- namely, Event Profiles and Splash Panel. These two panels report similar information obtained from the Matomo database -- albeit via differently constructed PHP cURL calls. Event Profiles: Once the panel fills, click anywhere where it says by Category and what will appear is an entry for all of the seven gates, but the one in question. Splash Panel: Click on any of the items under the heading By Category, and you will discover the same. The absence of data for the Gate Seven gallery. Click on any of the items under the heading By Named Event, and you will discover that the Javascript for Matomo is collecting the desired data. Indeed, you will find listed gate7a, gate7d, and title 7; all of these pages are tracked with the same category tag -- namely, Gate Seven. CAUTION: The Matomo application is extremely slow in my current server environment. You must be patient for the data to fill. Soon, I will have upgraded to a scalable cloud with my own dedicated IP address, and this problem is expected to go away. Also, note that the splash panel consists of some 47 individually constructed webpages eight of which contain Javascript using the same $.colorbox plug-in. INSTRUCTION: After you load the overview.html page open your web console. Then, click on the heading Splash Panel under Visitor Profile, open your Network tab in your web console, and look for a file called sevengates_splashpanel.php. Check the AJAX parameters sent to this page and notice that Gate Seven is among them. Then, check the pages Response section and notice the format of the 21 returned items. The pattern object, object, array occurs six times. For the last three items -- what should contain the information from Gate Seven -- are three empty arrays. QUESTION: How would you explain the aforementioned anomaly of three empty arrays? Roddy
  20. JJJorgensen

    Membership created/controlled pages

    I have no idea where to put this topic so if it's in the wrong place, please forgive me. We have committees/teams in our organization (membership login on website) who should be able to create and edit certain pages of our website online. These are really novice users so basically all they'll be adding is text and pictures but they'll want to make it "pretty". I'm currently using WYSIWYG 14 and CoffeeCup editor to build the website. WYSIWYG has a CMS function in it but I can't get the editors to work properly once I publish it. WYSIWYG doesn't officially support them so I can't really get an answer on what I'm doing wrong. The pages these people would be editing have a boiler plate frame so they're only editing one 'block' of the page. My question is, what is the easiest way to manage this? Or can you point me to online resources that will help me decide which direction to go? I tried searching and all I get is either CMS stand alone options (I cannot add programs to my computer) or 'how to build a membership website'. Considerations: Persons editing will change 1 or 2 times per year, very limited number of editors (5 or 6 tops) and limited number of pages (4 at this time and I don't see that changing much), ease of use for editors, archiving possibilities.
  21. iwato

    Working with the Matomo Cookie

    OBJECTIVE: Suppress my site's splash panel for repeat visitors using a mechanism similar to the one that I use to suppress the panel for visitors whose viewports are too small to handle it properly. BACKGROUND: As I have instructed Matomo not to recognize me when I access the application I have no way of testing whether my code is working. According to a friend who has experimented with his own computer it does not. Although I am able to retrieve the cookie set by Matomo, I am now uncertain about how to handle it. NOTE: The cookie that Matomo appears to set is not set until the page has The COOKIE Sent by Matomo Array ( [_pk_id_1_28d8] => b1dccabc0123a611.1529214805.24.1530731060.1530731060. [_pk_ses_1_28d8] => * ) The PHP that Recovers the COOKIE and Assigns It to a Javascript Variable if (isset($_COOKIE['_pk_id_1_28d8'])) { $cookie_set = 1; } The JAVASCRIPT on the Same Page as the PHP var cookie_set = <?php echo $cookie_set;?>; The JAVASCRIPT on a Loaded Script Page that Controls the Splash Panel if ((!refer_type && !navtype && (viewportWidth > 360)) || !cookie_set) { [the code that sets the splash panel] } QUESTION: Can you see anything in the above logic or design that could be showing the splash panel when it is not desired? Roddy
  22. BACKGROUND: Having recently learned about localStorage and familiarized myself with its methods I would now like to apply it as suggested by one of W3Schools' mentors for the purpose of identifying return visitors. Searching on the internet turned up little that was very satisfying. QUESTION: Is there a standard routine for identifying return visitors or must I develop my own? Roddy
  23. BACKGROUND: I would like to use the following HTTP Request query string, but substitute the empty quotes with something like null or undefined. What are acceptable non-values in this instance? "https://www.nudge.online/_utilities/php/matomo/index.php?module=API&action=index&method=Events.getCategory&url=www.grammarcaptive.com&idSite=1&period=year&date=today&segment=''&expanded=''&secondaryDimension=''&format=json&token_auth=363130ebb19736863e42030f91269e40"; Roddy
  24. I want to use a gif I made for my sprite (it would be nice if the gif only played when the character moved) So far, I have a rectangle with choppy character movements. (It would also be nice if I could make the character movement smoother. I watched tons of tutorials but I couldn't find anything that shows how to do what I want to do. Here is the code <!DOCTYPE html> <html> <head> <style type="text/css"> #backgroundColor { width: 100px; height: 100px; background-color: white; animation-name: backgroundChange; animation-duration: 45s; animation-iteration-count: infinite; } @keyframes backgroundChange { 0% {background-color: white;} 3.3% {background-color: #ffc5c5;} 6.6% {background-color: #f78a8a;} 10% {background-color: #f95d5d;} 13.3% {background-color: #f73737;} 16.6% {background-color: red;} 20% {background-color: #b70303;} 23.3% {background-color: #8c0202;} 26.6% {background-color: #5a0202;} 30% {background-color: #310101;} 33.3% {background-color: black;} 36.6% {background-color: #292929;} 40% {background-color: #3c3c3c;} 43.3% {background-color: #757575;} 46.6% {background-color: #d0d0d0;} 50% {background-color: white;} 53.3% {background-color: #ffc5c5;} 56.6% {background-color: #f78a8a;} 60% {background-color: #f95d5d;} 63.6% {background-color: #f73737;} 66.6% {background-color: red;} 70% {background-color: #b70303;} 73.3% {background-color: #8c0202;} 76.6% {background-color: #5a0202;} 80% {background-color: #310101;} 83% {background-color: black;} 86.6% {background-color: #292929;} 90% {background-color: #3c3c3c;} 93.3% {background-color: #757575;} 96% {background-color: #d0d0d0;} 100% {background-color: white;} } #canvas{ height: 540px; width: 6350px; position:absolute; top:50%; left:52%; transform: translate(-50%,-50%); box-shadow: 0 0 16px 2px rgba(0,0,0,0.4); background-color: #FFF; } </style> <title>Bermuda Triangle</title> </head> <body id="backgroundColor"> <img id="character" style="height: 40px; width: 40px;" src="https://piskel-imgstore-b.appspot.com/img/9478ea0f-79c8-11e8-b58c-67762e4a73c8.gif"> <canvas id='canvas' style="background-image:url(https://preview.ibb.co/fEanjo/realroom.jpg); height: 540px; width: 635px;"></canvas> <script> var canvas = document.querySelector('#canvas'); var context = canvas.getContext('2d'); var xPos = 0; var yPos= 0; context.rect(xPos, yPos, 40, 40); context.stroke(); function move(e) { //alert(e.keyCode); if(e.keyCode==83){ yPos+=10; } if(e.keyCode==87){ yPos-=10; } if(e.keyCode==65){ xPos-=10; } if(e.keyCode==68){ xPos+=10; } canvas.width=canvas.width; context.rect(xPos, yPos, 40, 40); context.stroke(); } document.onkeydown = move; </script> </body> </html>
  25. This code works perfectly on a desktop or laptop, and on non-iOS mobile devices. It takes a thumbnail sample of an edited image and displays it at full size in a new canvas. On iOS, I just see a blank screen where the canvas should be. function click5() { document.getElementById("preview").style = "visibility:visible;"; document.getElementById("cPreviewCaption").style = "font-size:90%; font-weight:550; text-align:center; color:#FFFFFF; padding-top:6px;"; // Apply change to preview image which will open beneath thumbnails var cP = document.getElementById("cPreview"); var contextP = cP.getContext("2d"); var cO = document.getElementById("cOriginal"); var contextO = cO.getContext("2d"); var imgData = contextO.getImageData(0,0,cO.width,cO.height); var data = imgData.data; //read full size image //similar image read/write code works fine in another image filter so this does not appear to be the issue for (i = 0; i < data.length; i += 4) { red[i] = imgData.data[i]; green[i] = imgData.data[i+1]; blue[i] = imgData.data[i+2]; alpha[i] = imgData.data[i+3]; } //set adjustments represented by user interaction with thumbnails for (i = 0; i < data.length; i += 4) { red[i] = red[i] + finalRedAdjust; if (red[i] < 0) red[i] = 0; if (red[i] > 255) red[i] = 255; green[i] = green[i] + finalGreenAdjust; if (green[i] < 0) green[i] = 0; if (green[i] > 255) green[i] = 255; } //write full size image with adjustments to memory for (i = 0; i < data.length; i += 4) { imgData.data[i] = red[i]; imgData.data[i+1] = green[i]; imgData.data[i+2] = blue[i]; imgData.data[i+3] = alpha[i]; } //write image in memory to file contextP.putImageData(imgData, 0, 0); //add borders for canvases. document.getElementById('cOriginal').style = "border-style:solid; border-color: #C0C0C0 #C0C0C0 #606060 #606060; visibility:hidden; display:none;"; document.getElementById('cPreview').style = "border-style:solid; border-color: #C0C0C0 #C0C0C0 #606060 #606060; visibility:visible; display:block;"; //Scroll page to preview image location.hash = "null"; location.hash = "previewAnchor"; } // End Table Click Event Functions I have tried this with small images, so dimensions and file size do not appear to be the issue. Thank you