slideit | Show markdown slides using RevealJS HTML on ruby

I am using JQuery to create a custom slideshow-layout and I am working on code that will

1. Calculate the width of the screen
2. Subtract the width of the images
3. Set the left margin to 1/3 of the difference between the width of the screen and images

The images seem to line up but chop off for the last of the 3 images. I am trying to make this dynamic so that it will make a spaced-out layout for any amount of images. Am I going about this all wrong? Also, is the space between inline-block elements setting it off?

Greetings and thanks in advance for the help. My first hack at javascript. Just trying to add a 2em black border around the slider, and remove the mouse pointer when hovering over the slider (I don't wish to offer links from the pictures).

Link is: www.bakashana.org/test-slider

Here is the entire code:

When I scroll the div, basically nothing happens. The method slideIt gets fired once when the object is initiated and that is it. It is not listening to the scrolling event! any reason why would this happen?

I have some restriction within the programme, it would be nice if the

solution doesn't need JQuery, as I have mention above, it does have some

restriction.

What i am trying to achieve is.

1. Change an image with JavaScript dynamically. (Done)

2. Each image will lead to a different link when user click on it. (Need help!)

Below is my current code.

I realise this is all over the internet, but I can't actually find one that I know how to use. I'm very new to JS, and still pretty new to HTML. The most useful thing I've found is this, except I don't know how to actually implement it into my code. Based on something else I found, I tried this.

Just checked my website via phone, and noticed that the page navigation menu does not closing then pressing any link. And i cant understand why and there is the problem. Cant find the cause of the problem... I am looking at the scrip code below to understand but...

site: www.scorpion3d.com

This is whole menu block which i have:

I have built out a form that slides in/out from the right side of the screen using JavaScript I found from a tutorial. Everything works but the person who reviewed it felt that the animation looks too "robotic" (or linear). It was suggested that I try to add a CSS3-like easing effect for the slide in and slide out JavaScript animations. I'd like to do this but, at the same time, I don't want to a) Redo all the code I have set in place since it does work so I don't want to scrap it all and start over, and b) Make the existing functions far too complicated or confusing to maintain just to create an easing effect.

Here is the JavaScript I have right now:

I'm working on my friends website to make it mobile friendly. He doesn't want a new site just to limit certain elements of the site for mobile users. So, I added a media query in CSS.

Here is the problem so far: When I view this site on my phone the content is not fitting to the viewport and I have to scroll (left to right) to view full site.. I'm not sure how to manipulate "max-width" properties correctly to make everything fit properly on mobile.

Here is a link to the code pen where I've started my draft: http://codepen.io/twesh/pen/RpwxLR?editors=1100

I'd be glad to clarify anything, all help is appreciated.

Thanks, Twesh

I am working on a simple slideshow. I am using Javascript for the process of the slideshow and CSS for display of it. For some reason the CSS shows the first image perfectly but the JavaScript function is not engaging with the CSS to change the images. Suggestions?

Here is my code: