matdemo159 Posted February 17, 2020 Share Posted February 17, 2020 Hello, I'm a total novice to HTML and am currently working on a really basic page: The user inputs a name into a form, and then based on their input, the page displays a series of images. Each character of the name corresponds to a different image output. i.e. the name "Joy" would output the image corresponding to J, the image for O, and the image for Y, in that order. My initial idea for this was to store the value of each character of the name into an array, and then sequentially output the corresponding images. However, I can't seem to find a way to store the input into an array, let alone one character at a time. Any help would be much appreciated! Link to comment Share on other sites More sharing options...
niche Posted February 17, 2020 Share Posted February 17, 2020 Here you go: https://www.w3schools.com/xml/ajax_intro.asp Link to comment Share on other sites More sharing options...
JMRKER Posted February 18, 2020 Share Posted February 18, 2020 Unclear of request. Clarification please. Are you wanting to display an image each letter of 'Joy' based upon user input? Or, are you trying to display a symbol of each letter of 'Joy' based upon some substitution logic? Or, are you wanting to display 'Joy' as a different font family or size or color? Do you have an example of what you are trying to create? Link to comment Share on other sites More sharing options...
matdemo159 Posted February 23, 2020 Author Share Posted February 23, 2020 On 2/17/2020 at 8:25 PM, JMRKER said: Unclear of request. Clarification please. Are you wanting to display an image each letter of 'Joy' based upon user input? Or, are you trying to display a symbol of each letter of 'Joy' based upon some substitution logic? Or, are you wanting to display 'Joy' as a different font family or size or color? Do you have an example of what you are trying to create? Hello, sorry for not replying sooner. Here's an example of what I'm trying to achieve, though for this mockup I just manually styled each letter individually. At some point I might want to use images, but for now simply coloring text will be enough. The goal is for each letter to have its own color, for example "P" will always be red, every time it appears. I want the user to be able to input their own string of characters, and then have the page give them the colored version of that same string. What's the best way to go about achieving this? My first thought, as I said above, was to convert the string into an array of characters and then use that to print the result, but if there's a better method then I'm all for it! Link to comment Share on other sites More sharing options...
dsonesuk Posted February 23, 2020 Share Posted February 23, 2020 I don't think you require an array, you just need to read each character, you know what image file name will be i.e a.jpg, b.jpg etc, so you read each character at same time create an img tag with src of letter found with addition of '.jpg', and append where you want. Link to comment Share on other sites More sharing options...
dsonesuk Posted February 23, 2020 Share Posted February 23, 2020 https://www.w3schools.com/code/tryit.asp?filename=GC7QFZ0HMZ7W Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now