I was wondering if there was a simple way to make a topdown list calendar for a website. I don't want to use the google calendar. I would also want the calendar to show like the next 5 events and hide the rest until the 5 shown have already happened. If there is a way to do this with jquery I wouldn't mind doing that either.
Here's a good starting point:
http://www.javascriptkit.com/script/cutindex1a.shtml
Just about every layout for a calender structure, and then event-show limiting etc could be implemented by you at the end. At the least it'll give you a base with which to work from.
Hope that helps.
Related
I have a high interest in creating my own event calendar/scheduler for my site and found Bootstrap Calendar, it has real potential. I looked at dhtmlxScheduler but its hard to customize the look, it has a lot of nice features though. I have a Fullcalendar now and I like the new Scheduler but I still want a more custom look and some custom functionally.
My JS/Jquery is limited so it makes it difficult to get a real picture of BS-Cal layout and unfortunately there seems to be little documentation other than comments in the code.
So my issue with BS-Cal is the event ordering/stacking in the week view.
The Question - Can the events be reordered in a per day list like the 2nd photo below.
So far - I see the offset class for the columns and the events but the events seem to be wrapped in a "row" div which forces a single "list" for the whole week rather than per day placement order left to right on the table.
Here is what I believe is happening:
This is what I'm hoping to accomplish:
so im trying to make a collection tracker for my magic cards because i dont currently like any of them out there and i have somewhere close to 15,000 cards and its really hard to keep track of that in my head :P. so what i did was i found this guide
http://dataforradicals.com/the-absurdly-illustrated-guide-to-sortable-searchable-online-data-tables/#comment-209
and it was extremely helpful but there are 3 parts that i would like to try to add to this. i would like to add a numeric spinner to each card so all i have to do is search on the webpage and +1 or -1 to whatever card i bought or sold. i would also like to add the low med high prices that can be found on tcgplayer.com. and lastly i would like to add either a picture when i hover over the name or the little camera button that they have on their site would work out well also. http://store.tcgplayer.com/collection/view/66999
please let me if you have any suggestions and thank you for taking the time to help me out :)
You have three questions in one, but I'll answer the primary (title) question.
So the easiest, crudest way to do this is to use <input type="number">. In most modern browsers, this will produce UI that will give you the functionality you're looking for. Since this project is just for you, just use a browser that produces the nice UI (basically most things but IE I believe).
If that doesn't suffice, you can turn to any number of polyfills, most notably jQuery UI.
Hope that helps!
I want to edit image in real-time with javascript only. Im new to Js, so this may be dumb question...
I have 3 images:
Background
Car one
Car two
I want to display one on each other in real time. It should look like this:
And the cars should be moving there and back (I must be able to edit their position without refreshing the page).
Im not asking for complete solution, just a few links or pages and some information where to start with. I know Javascript syntax, I just have never used it in any website. If it's not possible, or it would be too hard, I gonna use flash or Java aplet, Im okay to use jQuery or other Javascript libraries. Thank you for any clues!
You might want to check out jQuery animate and z-indexes. What you'll want to do is with z-index place one on top of the other, then animate with jQuery accordingly.
http://api.jquery.com/animate/
http://css-tricks.com/almanac/properties/z/z-index/
I'm working on a Rails app that has events in it, and I'd like to be able to show a timeline of events. There's an Event model, and events have a start_date and end_date.
I can show the events by date etc without any problem. However, what I'd like to be able to do is create a horizontal "timeline", similar to the network graph on Github. Basically I'd like to be able to plot a graph with lines from the start date to the end date, and for any given set of events I'd like the timeline on the top to start with the date of the earliest event and then span horizontally in even increments of time to the end date of the last event.
How would you accomplish something like that in HTML / JS? I believe I understand the server side of things enough to pull any needed data from the app, what I don't understand is how to make a view out of it. To be honest I'm not even sure where to start.
I really appreciate any feedback or suggestions on how to get started in tackling this. I realize this question is more open-ended than ideal, I'll be happy to try and make it more specific in response to comments.
try event_calendar, you may see some screen shots here and this is the railscast
HTH :)
What I want to achieve is as follows:
For example, there is a symbol which represents a table on a web page, a user can drag this element to any place on the web page, when the user looses the cursor, a dialogue box will pop up to ask the user to input values of attributes, for example,the number of columns, the number of rows, after the input, the corresponding table will come out at the place where the user chose. Of course, the symbol which represents a table is still at the original place. It is like a web version of dreamweaver. How to do this with Javascript?
If your question is how to start researching this feature I'd start with:
JQuery to get started with fancy yet easy javascript functionality
JQuery UI: Draggable, Dialog, etc
To actually develop the feature, if you don't know where to start, start small. Create a very basic web page with maybe just an icon and a button and then write some javascript to do something minor like display a dialog and show the result. Slowly start adding things like dragging something around, etc.
The JQuery UI stuff has lots of demos that you can start out with as a base to start customizing.
Warning: The first time I hit the JQuery UI Demos page I wasted at least a couple of days playing with all their cool stuff. It's so easy because the source is right there and you can also see it working in the browser on the demo page.
Did you look at the jQuery UI demonstration pages? The simple photo manager demo contains all the major pieces you'll need: Dragging an item, handling the drop event, doing something custom on drop. The revert demo may also be of interest
Begin by defining the requirements of your project. Break it down into smaller tasks and milestones. Then some learning and research on what javascript and frameworks like jquery can provide. Also check for existing solutions or components that you may be able to use and reduce your development efforts.