Jump to content

TonyC

Members
  • Posts

    7
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

TonyC's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. Thank you so much for the effort you put into that reply. I'm very much looking forward to trying it. I'm curious, I tried placing a transparent canvas on the page, I thought that would work, but all I got was a blank page: <body> <canvas id="test"> <script> const canvas = document.getElementById('test'); const ctx = canvas.getContext('2d'); ctx.globalAlpha = 0.0; </script> ... </canvas> </body> I want to understand canvases better, any thoughts on why that did not work? Thanks again, you're amazing!
  2. Okay, my next task is to get the rectangle to appear in a random position. This will require some minor tweaks, like replacing absolute numbers in the <svg> tag with screen width and height, but it's working: <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "<svg width = " + 1600 + " height = " + 800 + "> <rect x =" + (Math.random() * 100) + " y = " + (Math.random() * 100) + " height = " + 12 + " width = " + 12+ " rx = " + 2 + " style='fill:rgb(0,0,0); stroke-width:2; stroke:rgb(255,0,255)'/> </svg>"; </script> The problem is, the rectangle is appearing only within the small space that the browser is reserving for the paragraph. I want it to appear anywhere on the page. I tried using a <span> tag or a <div> tag immediately after the <body> tag and a </span> tag or a </div> tag immediately before the </body> tag, but that replaced the entire page with a small rectangle. Not what I had in mind. How would I get the rectangle to appear randomly on the page, in front of (or behind) the content? Thank you in advance!
  3. I'm starting to think there's nothing you don't know. Thank you very much!
  4. I hope this post is in the right place, I did not see an SVG forum. Some very basic SVG code: <!DOCTYPE html> <html> <body bgcolor="#000000#"> <svg width="800" height="400"> <rect width="200" height="200" style=" fill:rgb(0,0,0); stroke-width:2; stroke:rgb(255,0,255)" /> Sorry, your browser does not support inline SVG. </svg> </body> </html> Forgive "bgcolor", it's 2 am. 1. Why do the <svg> and <rect> tags both require width and height tags? 2 It looks like SVG is trying to create something like a beveled edge. There is what looks like 1 stroke on the top and left of the rectangle, and what looks like 2 strokes on the bottom and right of the rectangle. How do I get the same stroke on all four sides? Many thanks!
  5. There is no direct link between R and H, G and S, and B and L. The RGB value as a whole must be converted to HSL. There's a formula, I don't know it, but I'm sure you can do a search for it. As Ingolme explained, I think it would have to be done on a pixel by pixel basis. Is there an effect you are trying to create (like added brightness or contrast or hue change)? If so, that can be done easily with CSS Filters. BTW Ingolme, nice find, I had no idea that you could convert green screen to a background LIVE, that's very impressive.
  6. The syntax <input type="file"> is used to create a file open button and dialog box. What can I use to create a file save dialog box? Using HTML5, CSS3, and JavaScript (no libraries). Thank you
  7. I should specify in advance "Using pure JavaScript: I'm working on bare-bones HTML5 / CSS3 / JavaScript image editor and I'm ready to add a fileSave function. I'm going to use toDataURL() to allow the user to (1) save the file with a new JPG quality setting, or (2) save the file to PNG (I'm not aware of any options for PNG), or (3) save the current file format (typically JPG) and current quality setting. This last option will basically be the same thing as "right click" and "save file", but I would prefer something that will work from a button. How would I go about doing this? A code sample would definitely be helpful Thank you
×
×
  • Create New...