0

I have searched and searched to no avail so I apologise if this has been posted elsewhere already but I couldn't find it. Or I may have found it but not understood enough about the solution to use it for my problem.

I am using http://stratus.sc/ music player on my site. It allows one to click on links to tracks in the body of the site and have them play on the player at the bottom. Looks like this:

Parent Javascript

<script type="text/javascript" src="http://stratus.sc/stratus.js"></script>


<script type="text/javascript">
$(document).ready(function(){
$.stratus({
  links: 'http://soundcloud.com/someartist'
});
});
</script>

iframe HTML:

<a href="http://soundcloud.com/track"  class="stratus">Track Name</a> 

My problem arises because all content on my site is displayed within an iframe so that the player will continue to play as the user navigates. I need the href in the iframe to look for the class "stratus" in the parent window but cannot find the correct syntax to do it. It looks like it should have a fairly simple solution but I am quite a novice at HTML and even more so when it comes to Javascript and jquery.

Thank you in advance.

  • 2
    If you're hosting the page in question, can't you just append the style sheet to the child frame?? – Mike Oct 05 '12 at 21:17
  • I am running it from tumblr right now, I could host it in theory. I don't understand what you mean; I didn't think this had anything to do with the style sheet? – user1724011 Oct 05 '12 at 21:50
  • The contents of an iframe, in theory, should have their own css appended to them (html, head, body tags as well). If you're hosting the page that's being framed in, then you have control to add styling data to the page in question. Can you post a link to the working page in question? That'd add a lot of clarification. – Mike Oct 05 '12 at 21:58
  • [link](http://andyzzx.tumblr.com/) – user1724011 Oct 05 '12 at 22:38
  • Didn't realise hitting return would post. The top 'Play Supersized' is within the iframe, the lower one is on the parent page and is working correctly – user1724011 Oct 05 '12 at 22:39

1 Answers1

0

$(".stratus") will select all the elements of class stratus

Charles Bandes
  • 795
  • 8
  • 21
  • Where and how would I use that? Will it select them from the iframe even if the function is defined in the parent? – user1724011 Oct 06 '12 at 10:21
  • So how do i get it to select all elements with that class within the iframe? It only needs to look in the iframe, there will never be content out side of it – user1724011 Oct 07 '12 at 10:09
  • It will select all elements with that class in the document, including the iframe. If for some reason you need it to be more specific, use the class of the iframe (FOO) first -- $(".FOO .stratus") – Charles Bandes Oct 07 '12 at 15:04
  • If it selects all elements including in the iframe shouldn't the code work as it is? Will try your suggestion when I get home, thanks for your help – user1724011 Oct 07 '12 at 18:19
  • Cannot work this out. Have posted [here](http://jsfiddle.net/WCQbh/). If anyone could play around with it and get back to me that'd be amazing. Sorry for how messy and commented it is, have ripped it straight from a template. Thanks again – user1724011 Oct 08 '12 at 18:50
  • I don't understand what you're trying to achieve. Your code invokes a method called stratus on the jquery object itself. If you want to select items of class stratus, use the syntax I've provided. – Charles Bandes Oct 08 '12 at 22:55
  • I'm sorry for being unclear, I. If you look at the code [here](http://jsfiddle.net/WCQbh/3/) there are two links on the page. The lower one is identical but in the parent document and, when clicked, plays the associated track on the player at the bottom. The upper link is within the iframe and when clicked opens the link within the iframe instead of with the player. Granted in the example it is cross domain but it behaves the same when the page aren't. From what you're saying it should already work should it not? Sorry again, I'm not great at this. – user1724011 Oct 09 '12 at 01:07