i have a Wordpress site that has a "home" and a "photos" page. On the "photos" page, there are specific CSS and JS files that load only on that page.
I am using the Advanced Ajax Page Loader plugin to load the content into a div via AJAX.
So, when I click on the "photos" link on the menu, the new content loads into the div but the CSS and JS files that were supposed to load are not being loaded, because the <head> of the document remains the same.
I need to load those CSS and JS files after the content is loaded via AJAX.
Is it possible?
Yes,
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
this function has a parameter for the footer.
For styles it doeSn't matter where they are loaded, i think.
https://codex.wordpress.org/Function_Reference/wp_enqueue_style
Related
I recently deployed my Rails 4 web application on Heroku.
I am facing an Assets issue: When I go to the homepage or click a link to go to another page, everything is ok, and all the required CSS and JS files load. The problem is when I click on the “previous page” of the browser to return to the home page, the Assets do not load anymore, and the assets of the second page will be applied to the home page.
I put the CSS and the JS files in the Public folder, and made a link in every page using:
<link rel="stylesheet" href="/style.css">
<script src="/tablesaw.js"></script>
What am I missing?
Edit, in fact it was a Turbolinks issue, resolved, many thanks
im using the laravel 5.1 and building web app
i just bought HTML theme and directly copy all the css and Js files to public/assets ( not using any task runner such as gulp or grunt). i try to customize the login and register view page and if i use the default routing its fail to load the js and CSS ( just load plain HTML ) but if i point it directly by
Route::get('login','AuthController#getLogin')
its working . how can i fix the JS and CSS problem ?
*all the other pages works right and load the CSS and JS *
here are the screen shots from other pages and login page :
here is from my login page that fail to load :
if i use route to directly link to the page not passing through the Auth controller and after submit send data to login function ( like simple normal forms) its working but if goes through the controller system its fail . also if i use :
Route:resource('contact','contactcontroller')
my contact pages such as index, create , etc all are fail to load CSS but if i directly link to them like:
Route:get('contact','contactController#index')
it will successfully load the CSS and my page will be shows fine .
this question may help you with that !
Laravel stylesheets and javascript don't load for non-base routes
BTW : look at your page with firefox(chrome) Inspect Element Or Firebug to see the http requests!
Try using this way script and style link
{!! HTML::script('js/bootstrap.min.js') !!}
{!! HTML::style('css/bootstrap.min.css') !!}
<link href="{{URL::asset('../assets/css/bootstrap.css')}}" rel="stylesheet">
<script src="{{URL::asset('../assets/js/jquery.js')}}"></script>
I use these methods works 10/10.
I have a mako file included into a HTML template that takes time to load.
I want to load it only when the rest of the page is fully loaded.
Let's consider this html template fragment:
...
<section>
<%include file="widget.html"/>
</section>
...
I want the line <%include file..., to be read by the browser only when all the rest of page is loaded.
Any idea?
The browser doesn't read the <%include...—it's interpreted by the server before being sent to the browser.
You could have an onload JavaScript call that makes an AJAX request for "widget.html" and puts it in your page.
I use JSF Ajax on my menu links to load the content of the page.
content is loaded with ui:insert and ui:composition with template attribute.
ajax is work and load the content with no reloadin the all page but I have a problem with my java scripts.
when I click menu Items the script reload with every new ajax request.
what should I do to prevent script reloading?
I'm not sure I understood your problem clearly, but maybe you should try to play with the rendered attribute of the h:outputScript component, for instance:
<h:outputScript library="js" name="ajax-util.js"
rendered="#{myBean.renderAjaxFunctions}" />
I have an aspx page that has an iFrame in it, I set the src attribute of this iFrame in the page load event.
The page that gets loaded into the iFrame has its own references to its own stylesheets and javascript files, but when the page loads, it tries to locate these files with a path from the parent page.
Example structure:
/application/example/parentpage.aspx
/application/iframepages/iframepage.html
/application/iframepages/css/iframepagecss.css
/application/iframepages/scripts/iframepagescript.js
With the iframepage.html containing the following lines:
link rel="stylesheet" href="css/iframepage.css" type="text/css"
script type="text/javascript" language="javascript" src="scripts/iframepagescript.js"
The problem seems to be when iframepage.html loads in the iframe on parentpage.aspx, it tries to load the css file from the path application/example/css/iframepagecss.css and likewise for the javascript it tries to load it from application/example/scripts/iframepagescript.js.
This only happens in Firefox, it works fine in IE, Chrome and Safari. Thoughts?
Thanks in advance.
Looking at AJAX and Relative Path Scope you can try to use the BASE HREF tag, or otherwise use absolute paths instead.