mouseover event hover info box with FullCalendar - fullcalendar

I really like the hovering info box used on this site with Fullcalendar: http://www.bigwood.nottingham.sch.uk/calendar
Does anyone know how I can achieve something similar with a non wordpress site? I would like people to be able to hover over the event on my Fullcalendar google calendar so that they get all the details of my pilates classes - here is my test page: http://www.pilatesintuition.co.uk/test/pilates-classes.html
I am not a programmer or coder, so please forgive me for my ignorance!
Many thanks.

Related

How to fix extra buttons on a Wordpress Video playlist

I have recently begun assisting updating my company's website. We have a few video playlists that I noticed have a ton of extra navigation buttons. I have an attached screenshot with the navigation circled.
I cannot figure out where the extra buttons are coming from, so I am unfortunately not even sure what the best questions are to ask here. The best I can find from digging around in the CSS are that there are references to mejs and aria. For all of my toying around. I have not been able to isolate one set of the buttons to go away and still show standard navigation buttons.
Thank you!
Check CSS Styling for input[type='button'] or button in your CSS.

FB send popup box position

Is there a way to position the popup box of the FB send button?
I've seen a "workaround" with additional CSS properties and tried it but it seems to be "cheesy" and not a good solution. FB developers pages has no reference to this so I presume that this feature is not contemplated!
The only thing that I can say is "What the hell are these FB guys thinking?!" - because let's say that I'm using the button at the bottom or the right of a page. If I click the "send" button the box pops up below the button and messes up all the page layout! Wouldn't it be smart to have a property similar to "position=[top|topLeft|center|whatever...]"??? How come nobody thought of this? Am I the only one to use FB buttons at the bottom of page?
Maybe I'm missing something and FB dev guys already took care of this (if that's case sorry if I consider you dumb regarding this question) if not IS THERE A WAY TO DO IT?
Thank you for any help and cheers.
(p.s. not trying to offend anyone, it's just one of those hair pulling issues :P)

How do I create a "new" flashing button?

I sincerely apologize if this is a noob question, however I am failrly new to web development and would like to ask the community with some help and advice in creating a type of flashing "new" button on a website.
What I am trying to achieve is an eye catching e.g. "new products" button.
Could anyone point me to a good tutorial for asp .net, JavaScript or jquery.
Thanks in advance and kind regards,
geoNeo
Aside from the poor UI design aspect of having anything blinking on your website, you can create an animated GIF image of a flashing button, and then use the onclick event to redirect the user to your next page when they click on the button.
For the animated GIF, I'd suggest making it blink a couple times, then stay solid for a much longer duration, then loop the animation. That way, you get the user's attention, but in a slightly more subtle way.

How accessible is Fullcalendar?

I'm having problems making FullCalendar fully accessible. I'm using the default month view and can't access the next, previous, and today buttons on the top right without using a mouse. If I run a screen reader, I can access those buttons but not without running the screen reader.
And on another note, I currently am using tool tips that pop up when you mouse over an event title to display more information. If anyone has any tips on how to make those accessible to a screen reader or accessible without a mouse, I'd greatly appreciate it!
Regarding the buttons, I would advice that you write new buttons if accessibility is important. These buttons you could then hook up to your own javascript functions that moves to previous and next.
Check out this documentation example
Regarding the second problem, I think that's the same problem not just for physically impaired but also for things like mobile browsers. My tip would be to avoid onmouseover if the information that appears is really important.

How to use jQuery to show a different page in ASP.NET

I am trying to set up functionality similar to Netflix. Where if you mouseover a movie - you are presented with a window of movie details (all client-side).
At high level, can someone in this forum help by telling me how this should be implemented? I.E., one or more .aspx pages, what would go in code-behind, and .js file, css, etc. Just trying to get an idea on how this would be set up to work.
Basically, when I hover over an item, I need to query for details that belongs for that record being moused-over and display it in the window or div. I also need to have some functionality in that window (i.e. a textbox and button which will end up needing to get saved in a database).
Thanks for any tips and suggestions -
You would want to add an AJAX call to the hover event of the image, that pulls from a webservice/web method.
Here is a good example, you would change some things. However, it should get you started.
http://www.mikesdotnetting.com/Article/96/Handling-JSON-Arrays-returned-from-ASP.NET-Web-Services-with-jQuery
If I understood your question correctly, you should try this excelent jQuery plugin:
http://www.sohtanaka.com/web-design/css-on-hover-image-captions/
Look at the demo here:
http://www.sohtanaka.com/web-design/examples/image-hover/
easy to install and configure and very slick!
Good luck
EDIT: sorry wrong lik the first time
There are certainly many jQuery plugins that will do this for you. jQuery UI may also be of benefit.
Here is one that appears to do something like you are describing:
http://plugins.jquery.com/project/VisualLightbox

Resources