I'm editing a website and I can't get it to work properly. I'm using a responsive menu to go between pages (stays in the same page but changes out the page elements). The code for it is here.
Now I'm trying to include a link in the text of the page (as opposed to just in the menu)
Here is the code for that plus the menu.
The link won't work at all. What am I doing wrong?
Related
We built our website using Adobe Muse, which has since become obsolete, but since beginning to manually amend the code outside of Adobe Muse, the dropdown button on our navbar has decided to stop working on some pages.
Please see the 'Depots' button on the below URL:
https://stc-uk.com/dropdown.html
When hovering, a list of our depots is displayed.
The same code is present on the below page, but the button doesn't do anything when hovering:
https://stc-uk.com/stc.html
We have tried to copy and paste the code but this doesn't work.
It's not a simple html/css dropdown button, as we generated the button through an Adobe Muse widget. We've tried to re-create the button just using html/css but it doesn't fit in correctly.
So I'm working on a project where I'm building a website and I have many pages that include tabs from Bootstrap that use jQuery to work. They work really well and I love them but on my homepage I want to be able to link icons to specific tabs. Once clicked they should move the browser to that page and that tab should open instead of the default active tab. I've found numerous examples of javascript on how this would work but I don't know how I can get the JS to work on my SharePoint site.
// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ;
}
// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
window.location.hash = e.target.hash;
})
Twitter Bootstrap Tabs: Go to Specific Tab on Page Reload or Hyperlink
The above code is from that answered question and I'm wondering if someone can show me how to use this on my SharePoint pages.
So, I've worked on this a ridiculous amount of time for the problem I was actually having. I used the above code along with Bootstrap 3 and jQuery with CDN links in the page. That was correct. I also used the right notation for the url which is www.examplehere.com/blahblah#tab_tab1. The problem I was having was that I loaded this script at the top of the page, prior to the HTML 5 actually loading and making the tabs contained in the body on the SharePoint site. This meant that it went through the code to switch the open tab to the one dictated by the url but the code didn't have anything to change the tabs to since the tabs didn't exist.
So if you want this to work in SharePoint 2013. Save the above code as a .js file, link to it via a Content Editor Web Part, use the urls with the #tab_tab1 syntax as above, and please do yourself a favor and put the Web Part at the bottom of the page unlike I did.
I have a problem in a site made with bootstrap
If I set an href tag from an external page that landing on a section of my page, I have a strange behavior : the link sends me to the correct section but the navbar at the top of the menu marks the next item.
If the same link is typed directly from browser, instead, everything is working fine (the positioning of the page and the navbar menu).
I've been encountering some problems with icon appearance
on my project, I have a multi-page html which i can only go with the attribute rel="external" (only way move to a multi-page html).
The problem is that whenever I click the link with the rel="external", the page loads without the icon pictures, instead, there are some empty circles which supposed to contain the icons.
this problem continues to occur throughout the other pages which shown after that rel="external" link.
Note that before i click the rel="external" link, the icons work perfectly fine..
What can i do?
The usage of rel="external" causes a full page refresh, so the target HTML page should include in its header tag all the JS and CSS required for proper appearance and functioning.
Could you check whether the jQM JS and CSS files are included in the target HTML files?
I hope this helps.
I've just noticed that javascript elements aren't working correctly on the website. They are working, however, they only work on one page, and not site-wide.
http://www.radonsystems.net
Javascript elements, such as menu hovering, work on that page. Additionally, so does the jQuery fancybox [click on live chat].
No go to http://www.radonsystems.net/business/profile.2, notice that the menu hover and live chat fancybox doesn't work.
Any ideas?
Ok, looks like removing a script breaks it up. Have to split up the javascript in the header.