Solved

Jquery Include?

Posted on 2014-09-19
4
236 Views
Last Modified: 2014-09-19
Please look at http://rkassoc.org/Davis/index9.htm. The solid blue background area in the center, right is supposed to have a menu in it.

See attached files; index9.htm and b.html.

Based on info I researched on the web, the Jquery
$(function(){
      $("#includedContent").load("b.html");
    });
is supposed to load b.html into the specified location; of course, there is nothing there.

What's wrong? Do I somehow have to force execution of that Jquery with a body "onLoad" function?

Note I only tried this in FireFox, not Chrome or other.

Thanks
index9.htm
b.html
0
Comment
Question by:Richard Korts
  • 2
4 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 40333309
remove your current script and use this one (check line 14) :
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
    $('.flexslider').flexslider({
        animation: "fade",
        controlNav: "thumbnails",
        slideshow: true,
		slideshowSpeed: 6000,           
        animationLoop: true
    });
    $('.flexslider ol img').click(function() {
        $('.flexslider').flexslider("play");
    });
	$('<div id="white-transparent"><div class="inside-white-semi-transparent" style="width: 67%; font-size: 19px; color: #4D4B4B; font-family: \'Univers Pro 55 Roman\'; padding-top: 30px; padding-left: 12px; line-height: 135%;"><span class="black-text">Welcome to Oklahoma\'s leading wholesale distributor</br> for irrigation, pumps, landscape, pool and outdoor living. products. For over three decades, family-owned  Davis Pipe and Supply has supported professional contractors with in-stock availability, technical support and knowledgable personnel. <span class="blue-text" style="color: #283781;font-family: Memphis Bold;"><b>Experience the Davis Difference!</b></span></span></div></div><div id=\'blue-solid\'><div id="includedContent"></div></div>').insertAfter(".flexslider .slides");
     $("#includedContent").load("b.html");  // once we add the div in the page, we can load the content (b.html) inside no before

});
</script>

Open in new window

0
 
LVL 58

Expert Comment

by:Gary
ID: 40333313
You're calling the load before the element exists - which you are dynamically loading later in the page.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 40333314
a bit of CSS, if that can help :
<style>
#includedContent {
position: absolute;
top: -236px;
left: -75px;
}
</style>

Open in new window

0
 

Author Closing Comment

by:Richard Korts
ID: 40333430
Excellent; thanks so much!

I have another one on this same page shortly.

Thanks!
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

756 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question