Bootstrap 3 - the menu occupies the entire screen when on mobile - twitter-bootstrap-3

I cannot figure out what I have done wrong...
What I am trying to do is make the Twitter Bootstrap menu behave correctly.
The problem I am experiencing is that on a mobile the menu can collapse and retract but it covers the entire mobile, i.e. you cant see the rest of the page below.
I have literally copied and pasted a bootstrap 3 example and that doesn't work when I host it!!! Have I missed something very obvious? This is probably best viewed on a mobile....
Here is the page that I put my code on http://www.hackerhotshots.com/y.php
And the original page here: http://getbootstrap.com/examples/navbar-fixed-top/
Can anyone pls see what I am doing so wrong?
Thanks -

Related

Custom Wordpress Theme showing jumbled mess in navigation

I installed a new Wordpress template I coded onto a company's server. However, when I went to preview it before activating, it looked totally wrong (the navigation had all these different words in there from another page opposed to the navigation links I programmed in). I deleted the old SQL database and added my own- what could be causing this? Thanks for any advice.
The site SHOULD look like: www.kleanir.com
But instead looks like this

Glyphicons Halflings and other font-based icons are not showing up on Chrome

I am working on a Ruby on Rails web app using Font-awesome and Glyphicons icons on top of Bootstrap. The icons do not show up on Chrome. I can actually get them to show up by hovering over them OR start the inspector (i.e. inspect element). Has anyone seen this issue before? I am losing my mind here....
As you can see, the first two icons are showing because I hovered over them, the rest are not showing up!
Thank you in advance for your help.

jQuery Animation

I am trying to recreate some effects similar to the div loading effects on this site i.e. there is no visible content when you load the page but upon clicking on a navigation link, it dynamically loads the divs.
http://worldofmerix.com
It is for a film studio website and I would like it to be interactive like this site. Does anyone know how I could achieve these effects with Javascript and/or jQuery?
Thanks for all the help in advance!
Have you used jQuery before or looked at the docs? This is really quite simple using jQuery's built-in animation effects such as fadeIn. The site you've linked to doesn't dynamically load the content - it's all part of the same page and simply displayed and hidden as appropriate.
Here's a rough fiddle showing how it works. Of course, you'd need to work out the styles and quirks in animations.

Joomla - Overlapping of modules required

I had to create a custom menu for the template we chose as the links were supposed to be added over a image. I have a header image which is called in as a module. When I select mod_mainmenu, the menu shows over the header image. However when I disable the mod_mainmenu and select the custom html mod , they come below the header image.
I need it also to come as the menu. Which will resolve the issue.
www.diaryboard.com/ship
This is the link. Could someone help me on this.
Regards
Edward
The first problem I see is in your template.css file on line 672 -
height: 448pxx;
Fix this typo first. You could probably do without the absolute positioning for the logo, but the typo will probably make the page look right.

Google Maps API not letting go of the mouse click

I'm using the Google maps API to place a map onto a web page, just like millions of other sites have done.
However, once I click on the map (and let go), the map then acts if the mouse button is still being held and drags the map all over the page. The only way to get free of this drag action is to hit F5 and reload the page.
I've spent several hours scouring Google to find a remedy to this but can't find any mention of this issue from anyone else.
The problem can be seen at the bottom of the following page:
http://www.ef-deutschland.de/master/lt2010/default.aspx
Does anyone have any idea why this is occurring?
I vagely remember encoutering something similar a while back, I think it was caused by having an overlay somewhere on the map that wasn't supposed to be there.
Also try simplifying the code, put the map on its own page (without all the other jQuery stuff going on), and remove all parts of your code one by one until you can isolate the problem...