Response title
This is preview!
Move this topic
Linking to an anchor name in a webpage hosted within a Jquery accordion
in Getting Started
•
2 years ago
I want to create two accordions on the same page. The first accordion will host web pages of articles for different topics that are located on my site using a iframe or Ajax (not sure which is best yet). The second accordion will host web pages that have different indexes for each of the different topics.
1
Replies(7)
Yes. It is possible. But would require some work.
You can catch all the links with
$(document).on("click","a[href=*’#’]",function(){
//…
})
Then you have to figure out which leaf the link is in, and which accordion.
Leave a comment on jakecigar's reply
Is it best to host the web pages with Ajax or iframe? I have been told that it is best to not use iframe, something about browsers not being able to scan the article. I don't understand why it couldn't but then I don't understand any of this very well. They advise to use Ajax but iframe seems easier than Ajax and I noticed on the accordion page of this site that they use an iframe to host a sample accordion. But now that I think of it I guess there really wouldn't be much benefit in a brower searching that iframe since the content is a foreign language. I had been using Dreamweaver and then decide I wanted to learn to do it in a code editor so I would have more control I have been studying html and Java and now I am studying jquery as I build site. I had this idea of how to lay it out and can't see doing it any other way if it is possible. Since you say it is then I am not afraid of learning how. But would rather go the route of least resistance and not waste my time with one way if the other is better. I couldn't find any tutorial describing how to achieve this using either way of accessing webpages into one web page design and didn't want to waste my time if it wasn't possible. So the question now is which should I use iframe or Ajax? And also is there a tutorial anywhere showing how to do it.
Leave a comment on Susanmanwil's reply
JavaScript, not Java. Java is a completely different language!
If the page is on a different site, as a practical matter, you will HAVE to use iFrame. And that's what iFrame is for, and the most appropriate use of iFrame.
If the page is on YOUR site, it's best to use Ajax. I've included a link above on Ajax from the jQuery Learning Center.
The content that you will load using Ajax should not be full pages - just the HTML that you want to load into the tab. Don't include scripts or style sheets, or <html> <body> etc. Your Javascript code will fetch the response and replace the content of the tab.
It's unclear from your post if the second accordion will host MULTIPLE pages (how do you navigate to the different pages?) and each page has some anchors, or if it will host ONE page that has some anchors.
Leave a comment on watusiware's reply
Ajax or fetch is best. iframes are less popular these days,
DreamWeaver is also less popular.
Ajax is explained all over the ’net. The jQuery Learning Center has tutorials.
.ajaxComplete() | jQuery API Documentation shows the options.
A reasonable explanation of what Ajax is is at Ajax (programming) - Wikipedia (don’t bother with the non-jQuery code examples)
JΛ̊KE
Leave a comment on jakecigar's reply
It's unclear from your post if the second accordion will host MULTIPLE pages (how do you navigate to the different pages?) and each page has some anchors, or if it will host ONE page that has some anchors.
Yes, the second accordion will have indexes(A-Z Index similar to the indexes in the back of books), one in each tabs for each of the topics I am writing articles on. There will be numerous accordion tabs to each accordion. I will be linking from the keywords in the second accordion to anchor names in section of the article that expands on that keyword and also linking from the heading of the article to the index that represents it. I will navigate using a vertical accordion menu shaped in the form of a book marker. The whole site looks like a book with pages that's the reason for the book marker accordion menu. It will link to the main sections of the book and there will also be a table of contents linking to the various articles and indexes on the site.
It looks like Ajax is indeed the way I need to go. I just wanted to be sure it was possible to do it this way since I have not found any articles or tutorials on linking to named anchors within the content of either an iFrame or an Ajax generated webpage within accordions from another iFrame or Ajax generated webpage within accordion. I have found lots of articles on Ajax and jQuery accordions but nothing on this type of linking. But I am sure if it can be done I will figure it out.
Thank you both so much, I don't feel like I am spinning my wheels now.
Leave a comment on Susanmanwil's reply
From what you said above, you don't need Ajax at all.
If each section contains a topic, just load everything in one page, unless that would make the page too large to be practical.
No Ajax. No iFrame.
How many sections? How big is each section?
Otherwise, you COULD use Ajax to load the section contents. When you you load the content? When the user selects the tab? Then they will have to wait for a response from the server. On the other hand, if you load it all in one page, and it is large, then they will wait when they first enter the site.
Still having to guess at the details of your design. It is difficult to envision the content of a website from a word description. Pictures are better. Better still are demos (you can use jsFiddle), even if incomplete. At least then we can see your HTML and look at the page and understand what you are talking about.
Leave a comment on watusiware's reply
|" If each section contains a topic, just load everything in one page, unless that would make the page too large to be practical."
Actually that is how I started out doing it, then realized that some of the articles will be very long, even book length and felt it would take too long to load them all at once. For example I plan to index the Bible each book separately plus as a whole. I then remembered dabbling with frames a long time ago and researching frames lead me to iFrames.
I have a partial preliminary version loaded on the web which is in the spry accordion version. I just loaded it to see how it would look and work but have changed it up so much trying to switch to jquery that I need to reload it. I will do that in a day or two so you can see better what I am trying to do and make sure which way is better.
Thank you
Actually that is how I started out doing it, then realized that some of the articles will be very long, even book length and felt it would take too long to load them all at once. For example I plan to index the Bible each book separately plus as a whole. I then remembered dabbling with frames a long time ago and researching frames lead me to iFrames.
I have a partial preliminary version loaded on the web which is in the spry accordion version. I just loaded it to see how it would look and work but have changed it up so much trying to switch to jquery that I need to reload it. I will do that in a day or two so you can see better what I am trying to do and make sure which way is better.
Thank you
Leave a comment on Susanmanwil's reply
Change topic type
Link this topic
Provide the permalink of a topic that is related to this topic
Reply to Susanmanwil's question