I'm not sure if javascript is the best solution but here's what i want to achieve.
The web page is divided in 3 columns...
The left column should have links in picture format like Arts, History, Science etc
Clicking on any of these link should generate a series of links in the rightmost column say clicking on history should generate links for Civilization, World war etc Science should generate links like Physics chemistry represented by pictures etc and so on
Finally Clicking on these links say World war should display the content in the central column giving a brief history on World war....
Also each time a user clicks on an image link say Science it should get highlighted so the user can navigate easily from one topic to another.
I'm a novice to programming, not sure if javascript is the best approach. Also I'm very confused as to how to go about this problem where to begin and how. Any help in terms of code chunks or references or algorithms or advice on how to approach this problem would be most appreciated. If solving this problem means learning a new programming language i'm open to try.....
In case if i'm not clear in explaining the problem let me know
JavaScript would be appropriate for this. The appropriate approach will depend on how much content you have.
If it's reasonably short, you can achieve all of this by simply changing the display property on your elements (use JavaScript to set the CSS of certain page elements to show (display:block) or to hide (display:none).
If you have pages of text, you may want to look into Ajax. It is a bit more advanced that simply showing and hiding elements that are already there.
Related
I am attempting to scrape details from two archived webpages, here and here.
As you can see, the content lives in a paginated table (10 records are shown out of 30+) that I believe is being controlled with javascript - if you hover over the right arrows at the bottom of the table, you can see they are advanced through a doPostBack call. Unfortunately, these arrows are non-functional in the archived pages themselves, as is the drop-down that allows you to change the number of visible rows in the table.
Does anyone know how to either (a) get the javascript working to advance the table correctly or (b) gather the information some other way from this webpage? I've attempted to look at the request/response objects as well, but I'm quite a novice with web scraping so there is a good chance I missed something.
Any direction (or being told its a fool's errand!) is helpful, thanks in advance to whoever takes a look!
I have some text I'd like to publish, but feel like the "ebook file format" route is just too ridged and doesn't add much, considering what it asks of the user (install reader, download, open... Try another reader... Use iTunes to transfer a file...)
For my purposes, I think it'd be nice to try to create a minimal "browser-native" ebook reading experience. I have book-like content that is formatted in a pretty obvious way. Forgetting about chapters and all that, just imagine a long series of html paragraphs of varying length.
What would be cool is if I could have a <div> to contain the "page" (sort of the book "view port"), and have Next/Previous buttons that scroll through the text one div-hight at a time, without any animation (so it looks like you are flipping pages and not scrolling.)
I worry about lines of text being cut in half instead of dividing the text at per-line boundaries, which I bet is a fixable problem!
Any ideas about how to do this in a clean, minimal way, or maybe suggestions for "frameworks" that exist for this purpose? I'd also be open to an in-browser (e.g.) ePUB viewer if a good something-like-that exists.
If you are really open minded and creative, I would suggest you to try or use as insipration the navigation of "RevealJS".
RevealJS
https://revealjs.com/
(It can be used without the Slides software, you can use it completely programattically)
Usage Examples:
https://cgi1.gitlab.io/g2scoring-presentation/
https://www.jmrenouard.fr/sshcookbook/#/13/1
(Use Arrows, Press ESC, Click, Press M ... All of those, can be customized)
First of all, the question should be a bit bigger but that is the main point, I guess.
Let me explain a little of what I want to do so you can have a better idea. Basically, id like to make a card game (no 3D nor 2D graphics), just a basic form where I have a deck of cards loaded in memory. After playing a card i'd like the form to update some information (labels, images, or X behavior) based on the card's effect, however, I don't want to hard code the card interactions/effects within the card control, I want to get all that from a script (for example a lua script). For example:
I have a script named "0001.lua" and it has 2 effects coded;
Deal 2 damage to opponent.
Deal 4 damage to opponent and destroy this card.
In the game I draw a card with ID 0001 and play it. When right clicking the control that works as a card, id like to display a list the effects in the script and depending on the chosen option to execute the selected function inside the script and update the information in the form (if it was effect 2 - deal 4 damage and destroying the control/card).
with all this in mind id like to ask the following questions:
How can i achieve something like that?
Is that called "embedding"?
In the information I mentioned lua as the scripting language but I don't know if that is the simplest scripting language i can use to do this, is there a simpler scripting language? I would like to keep it as simple as possible.
Can anyone provide an example to do something like this? I'll greatly appreciate it (it's okay if it's simple, I just want to know how to accomplish the back and forth communication between the script and c#)
Also, c# is no a requisite. I just mentioned c# because I feel comfortable coding in it. If there is another language more appropriate for this task i'm open to suggestions.
I think that it is much more simple to use C# scripts from C# than lua.
Check out these questions
[1],
[2].
Note: Don't forget about namespaces. If you want your scripts classes to inherit your classes or interfaces from main application, then your scripts should use same namespace.
I found a lot of resources about my question, but I'd just like opinions based off of a high level overview of what I'm trying to do.
Basically, I'm using a combination of Javascript, and HTML to build a customizer for a friends' website. I should start by saying that I have some HTML experience but this is the first time I'm using Javascript (I am experienced with Java). The ultimate goal will be something like a customizer to allow users to select the parts of a bicycle and change their colors to place custom orders.
I've got the various parts of the bike as images files, and I'm using this jscolor color picker found at: http://jscolor.com/examples/#example-showing-hiding to allow the user to select a color from the color map. My plan is to layer a given part (photo) on top of a copy of the same photo, and fill only one of them, like layering in Photoshop. This way, the part fills in the correct shape, instead of filling as an entire square of the image file. As the cursor moves, the color should change in realtime. Once done, they can save the part and the color record will be kept on the back-end.
As I'm new to Javascript and not that experienced with HTML, I'm finding it a bit challenging to get this on the right track. So I'm hoping for some advice from some people who are experienced with HTML/Javascript/CSS to point me in the right direction to get this going along a better track than it is currently. I wasn't sure how to "phrase" what I'm trying to do.
The three main parts I'm addressing:
Using HTML buttons to load a different bike part (essentially load a separate image file).
Adding the color from the jscolor picker to the image of the selected part.
Saving the state of the part when the user clicks a Save button.
I will continue to search the forums as I already saw a few leads similar to what I want to do, but I mostly want to know if my approach seems feasible for what I'm attempting to do.
Thanks in advance!
Using normal HTML buttons will make things complex for you.
I think leveraging HTML5 Canvas API is a better way to approach this problem. Canvas is the HTML5 element for helping out you do the graphics manipulations using JavaScript. Learn more about canvas here.
You can make use of a library such as Fabric.js to make things easier.
I'm creating a 1 page dashboard that will run fullscreen on a monitor on which I want to display some graphs. I made the graphs already all I need now is a proper template for the page. I was thinking something like this
I really dig the look but I'm clueless on how to make something like this using presumably css/js. Especially the lines in the background and a titlebox.
First of all, you have to code all of the man div-containers including your graphs and data-visuals. For that, a css-framework could help you managing the different views for all devices (http://getbootstrap.com/).
Later on, you could add inner divs for the title box and the background. Also get yourself some inspiration. For example: this is the admin-theme I am using for my actual project: http://admindesigns.com/framework/dashboard.html
After digging into that, you may ask some deeper questions about styling your Dashboard, so it's easier for us to respond to an actual problem ;)
Cheers,
Chris