I want to use fancybox from inside flash.
I call a javascript function with
var url:URLRequest = new URLRequest("javascript:callPopup()");
navigateToURL(url, "_self");
and
function callPopup(){ alert("works");}
which works fine.
now I want to use this function to open my fancybox content.
the flash content is placed with swfobject. under the flashcontent-div I have my link to the fancybox-content:
<div id="micrositepopup">
<a id="popup" href="images/microsite/microsite.jpg">test</a>
</div>
and I call on pageload
$(document).ready(function() {$("a#popup").fancybox();});
when I click on the test-link all works fine.
but how could I call the function
function callPopup(){ $("a#popup").fancybox(); } // not working
to open the fabcybox with the linked content?
thnx!
ah - ok. you need to use
function callPopup(){ $("a#popup").trigger("click"); }
;-)
Solution:
you need to use: Jquery in Flash CS5 with Fancybox
http://www.experts-exchange.com/Software/Photos_Graphics/Web_Graphics/Macromedia_Flash/ActionScript/Q_26325406.html
Related
I am a beginner in playing with jQuery/AJAX, my goal is to load content to the div below:
<div id="blogcontentloaded">
</div>
I came up with .load and it worked, the page loads but it keeps refreshing and loads over and over.
$(function loadBlog(e) {
$('#blogcontentloaded').load('/blog/page1.html');
e.preventDefault();
return false;
});
I tried using e.preventDefault but it doesn't work for me.
Also my goal is to do this without any buttons. When main page loads portion of the page that I want to load along with main page is going to be for updating the content in loaded element.
Thanks for the help!
You can use the javascript load function. It may solve your problem. here you can get some information about windows load and jQuery ready functions.
$( window ).on( "load", function() {
$('#blogcontentloaded').load('/blog/page1.html');
});
You need to wrap the function in the 'ready' function and make sure that it is executed once:
$(document).ready(function(){
$('#blogcontentloaded').load('/blog/page1.html');
});
Have you used the jQuery file on the top of other js files?
Add the jQuery.js file
$(document).ready(function(){
$('#blogcontentloaded').load('/blog/page1.html');
e.preventDefault();
return false;
})
I'm developing one Flipbook by using html, css, js. Also, i have included video files with the Book. The problem with the book is, When i load the book for the first time, video file is working, after flipping Video is not working. I found what the problem is. It needs to be refreshed when each page turns.
The following is the code which i'm using to call the video file.
<a class="voverlay" id="sk" href="index_videolb/vdbplayer.swf?volume=100&url=video/change1.mp4" onclick="javascript:myfunc();"><img src="index_videolb/thumbnails/change1.png"/></a>
<script>
function myfunc()
{
location.reload(true);
}
</script>
The problem with the code is, It only access the Onclick function, not href.
Is there anyother way to access both href and onclick?
If you have both href and onclick, href would override any onclick behaviour. To avoid that you can do,
<script>
function myfunc(event)
{
event.preventDefault();
location.reload(true);
}
</script>
Try this
function myfunc() {
window.location = "index_videolb/vdbplayer.swf?volume=100&url=video/change1.mp4";
}
I have a simple app done with jQuery Mobile, in some point I have this:
Start!
which loads a new HTML with a lot of jquery mobile pages:
<div data-role="page">
I have defined, in my external JS file, an global variable:
var startTimeQuestion;
And this method, which is inside my HTML (test_es.html):
<script>
$(document).on('pagecontainershow', function() {
console.log("Storing time..");
startTimeQuestion = new Date().getTime();
});
</script>
The problem is that when I click on the button it loads correctly the file but it seems like it don't load the JS or the function or I don't know, because when I'm going to use my startTimeQuestion variable it says UNDEFINED and it don't show in the console the 'Storing time..'. If a reload the page, it works fine.
I have tried to do an '$.(document).ready()' function for the first time I load the page but still not working. It looks like test_es.html it isn't loading my custom.css and my test.js file until I reload completely the page. So I supposed that the error is in how I call my test_es.html, it isn't this:
Start!
the correct way to do it?
Thanks.
Thanks to the comment before I found the solution, it was as simple as put the 'data-ajax' attribute to false this way:
Start!
Im looking for my webpage to jump to an iframe when someone click. I've found one solution which works pretty well which is this: http://jsfiddle.net/RGjCL/4/
<ul>
<li>
Class Name
</li>
</ul>
<script type="text/javascript">
function IFrameScroll(link){
window.myIframe.location=link;
window.location.hash='myIframe'
}
</script>
<IFRAME id = "myframe" onload = "setIframeHeight( this.id )" name="myIframe">
I've tried on my web and it partially works except for the fact it scrolls to the iframe before it loads so it doesn't goes that far to the bottom because once the iframe its loaded the page fully extends.
The web in question is the following: http://www.clavederock.com.ar -
The links are under the tabs "Quienes Somos" "Programacion" and "Archivo".
I hope i made myself clear so you can help me. Thanks in advance!
Try moving window.location.hash='myIframe' from the function IFrameScroll() to setIFrameHeight(), so you'll change the hash once the iframe have the desired size.
EDIT #3:
Since you need to wait until iframe is loaded in order to resize it and window.location.hash doesn't works the second time in chrome, you can try this:
<script type="text/javascript">
function IFrameScroll(link){
window.myIframe.onload = function() {
// this will ensure that the height will be updated after load
setIframeHeight('myIframe');
// This works on FF and IE, and let users to bookmark
window.location.hash='myIframe';
// and this will allow it to scroll the second time for chrome
document.getElementById('myIframe').scrollIntoView(true);
}
window.myIframe.location=link;
}
</script>
I really hope this solve your problem :)
Instead of jumping to the iframe, you could make a smooth scroll. This would give a little more time for the iframe to load after the link has been clicked.
Alternatively and probably more effectively, you could load the iframe with the rest of the page but make it invisible. Then you just need to show it when the user clicks the link
//load the page with the iframe hidden
//in css
#myIframe { visibility: hidden; }
//use jquery to make it visible when the user clicks the link
//you could do this with javascript if you don't want to import jQuery, but I find jQuery easier
$(document).ready(function() {
$('#myAnchorTagId').click(
function() {
$('myIframe').css('visibiliy', 'visible')
}
)
});
Hello my problem is that whenever i load content to an iframe through javascript and jquery it only loads the first time and then i cannot load anything over it.
the function I use is this:
function loadContent(elementSelector, sourceURL) {
$(""+elementSelector+"").attr('src', sourceURL );
}
and i call it through
<li><span>Google</span></li>
Am I doing something wrong?
Thanks!
I've tried to reproduce your problem, but I was not able to. I've create a very simple site with to links and one iframe:
<a class="iframe" href="http://microsoft.com">Microsoft</a>
<a class="iframe" href="http://google.com">Google</a>
<iframe id="oPanel"></iframe>
and 4 lines of unobstrusive JavaScript to load those links within the iFrame:
$('a').click(function(){
$('#oPanel').attr('src',$(this).attr('href'));
return false;
});
And it's working as expected. You can try it here: http://jsfiddle.net/jQncy/