I am looking at this website here, https://www.symbolab.com/
, and in particular the matrix entry function on it. Pressing the icon with the brackets to the left of the H2O icon will take you to it.
Now, you are then prompted to enter your own user-defined size of matrix. Below then in a text area then appears the blank matrix, with the predefined text fields arranged in an array.
I am wanting to replicate something similar myself, and was wondering how this site was performing this function. I am new to HTML and was wondering what components were being used here? Is the larger area that the matrix is contained in a canvas? Are the fields of the matrix Input Type Text fields? If so, how is the resizing dynamically achieved as the user enters text?
Anyone know? :)
Jeremy
The first step when you want to know what's happening behind a website is to open the console and look at the code and scripts. I think that the textarea used into your example is a basic textarea.
If your looking for a textarea that auto-resize, you can achieve this in JS. Maybe that post can help you.
If your looking for a way to write math formula into an HTML page, there is several solutions for you on the web. That stackoverflow post propose to use MathJax.
Hope it helps you a bit.
Related
Many sites show suggestions for what you are typing as a drop down, with some showing the most likely result as a "preview" to the right of the cursor in a lighter-gradient font.
For example (this is from Spotlight on my Mac):
spotlight text suggestion
Is there any way to reproduce this within a standard HTML input element, or does it require a more complicated rich text (e.g. Slate) approach?
Unfortunately, this is not possible via the input tag.
However, there are a couple of ways to do that.
Slate is a option but I think you can craft something way easier.
For example, you can make a <div> with the attribute contenteditable. When you type, the div expands and after the "input div" you put another element which has the autocompleted results.
Either way you definitely need JS to accomplish that. Wor splicing the String or for going through your possible results. If you still have this problem, I could write a smapp codepen demo.
I am in the process of setting up a website via Enjin's web hosting for a game server I run. I have an HTML module that will display a map of the island our game server takes place on, with a grid overlay already.
What I am trying to do (if possible), is to create a dynamic grid with css and html (javascript if needed) that overlays the grid of the image and highlights each cell as a user hovers over it, with a small pop-up with details on a specific coordinate (such as any bases, or other special information about a specific area)
I have tried looking around via google, but all searches come up with creating a grid out of multiple images (which is not what I am after), or using the area tag without much explanation on how to turn it into a fullout grid.
I am unfamiliar with how to approach this problem, and would like any input or advice if possible. Thanks!
NOTE: For those wishing to see the map in question I am using, to better help understand my question and assist me, please see here.
actually I have developed simple chat application for android device using Flex 4 and Cirrus. now I need some help regards of the Design. actually for the incoming Text Message I just used the spark TextArea. but I need to use "Callout" box like this
kindly any one suggest me some idea regarding this. thanks in advance.
First of all, don't use the TextArea for incoming text. A simple Label or StyleableTextfield would be much faster.
Considering your Callout, I don't see any reason to use one. Use a Skin that draws the box and arrow instead. That would be much lighter (hence faster) than using a Callout for every single message.
I am no expert in Flash, and I need some quick help here, without needing to learn everything from scratch.
Short story, I have to make a list where each cell contains an image, two labels, and a button.
List/Cell example:
img - label - label - button
img - label - label - button
As a Java-programmer, I have tried to quicly learn the syntax and visualness of Flash and AS3, but with no luck so far.
I have fairly understood the basics of movie clips etc.
I saw a tutorial on how to add a list, and add some text to it. So I dragged in a list, and in the code went list.addItem({label:"hello"}); , and that worked ofc. So i thought if I double-clicked the MC of the list, i would get to tweak some things. In there I have been wandering around different halls of cell-renderers etc.
I have now come to the point that I entered the CellRenderer_skinUp or something, and customized it to my liking. When this was done, I expected i could use list.addItem(); and get an empty "version" of my cell, with the img, labels and the button. But AS3 expects an input in addItem. From my object-oriented view, I am thinking that i have to create an object of the cell i have made, but i have no luck reaching it.. I tried to go
var test:CellRenderer = list.listItem;
list.addItem(test);
..But with no luck.
This is just for funsies, but I really want to make this work, however not so much that I am willing to read up on ALOT of Flash and AS3. I felt that I was closing in on the prize, but the compiler expected a semicolon after the variable (list.addItem({test:something});).
Note: If possible, I do NOT want this:
list.addItem({image:"src",label:"text",label"text",button:"text"});
Well.. It actually is what I want, but I would really like to custom-draw everything.
Does anyone get what I am trying to do, and has any answers for me? Am I approaching this the wrong way? I have searched the interwebs for custom list-cells, but with no luck.
Please, any guiding here is appreciated!
Sti
You could use a Datagrid as well, with each column pointing to the appropriate part of the data source (possibly even the same field, depending on what you're doing). You can then just use the ImageCell as the renderer for the second and third colums.
I think you're just not understanding that Adobe, in the own woolly-headed little way, is separating the Model from the View on your behalf. You hand the Model to the View and then get out of the way. The extent of what you can/should change is just telling it what renderer to pop your data into.
In fact, the fl.controls don't give you much control at all about how they work--I wouldn't go down the road of trying to create a custom itemRenderer with any signifcant functionality for them if you don't fully understand how the Display List works and if you're not comfortable digging around in the debugger and ferreting out all kinds of undocumented information.
For more details (to the extent anyone knows anything about how these work), see
http://www.adobe.com/devnet/flash/quickstart/datagrid_pt1.html
http://www.adobe.com/devnet/flash/quickstart/datagrid_pt2.htmlhttp://www.adobe.com/devnet/flash/quickstart/datagrid_pt3.html
http://www.adobe.com/devnet/flash/quickstart/tilelist_component_as3.html
Do you have the option to use the Flex Framework instead of pure Flash? It makes this kind of extension much more satisfying. It's aimed more at application developers, whereas Adobe sees Flash users more as designers.
I have an Access form displaying a tiny amount of data for a certain type of record. Basically it just prints the name on the left and on the right has a bunch of Rectangle controls whose background color I change in the form's OnLoad() function, according to results from a query performed using that record's ID as parameter.
This all worked fine, got my ID/name on the left and 31 boxes on the right, colored if that day of the month is reserved :) But needless to say that function can be completely arbitrary since it's code.
Then I decided to switch to 'continuous form' as to display as many records/items as possible. But alas, it was not to be -- all boxes were colored according to the query/function performed for the first record only. I figured that might be because it's the OnLoad() but changing it to OnCurrent() did not do much either. As it turns out, or that's what I read, the Rectangle intances are shared over the entire form and if I change the BackColor for one of them it changes for that box for each record.
I want to be able to change this according to a query performed on a per-record basis. Is there any way? Up until now I've only been able to find conditional formatting (the feature that's nor available for rectangles nor seems to cater my exact needs?) and kludgy Access 97 text-box hacks.
Thanks in advance :)
You may be coming from an HTML background, where rectangles would be a natural solution. They aren't in Access. I don't think they'll work for you (in fact, "kludgy" could describe the attempt in my humble opinion).
You can however display an image. You'll keep an image for each status ready to call up. I've made visual displays this way. A little later I may be able to post some code, but I think you'll find this plays out pretty simply even if I don't.
ADDED NOTE: I'm glad this looks like it will work for you. You are concerned about "instanced only once" in your comment below. Yes, that's true for rectangles which are unbound controls (because they are designed for mere ornamentation). But you'll be using an image control which is a bound control (see Remou).
Change each rectangle to a text box, Control Source:
=Iif(myConditionIsMet,"ÛÛÛÛÛ","")
The "Û" is the Full Block character in Arial (asc 219).
All unbound controls in a continuous form will be the same; bound controls can be varied using conditional formatting.