1

I'm using the following jwplayer6 script on a page. 

<script language="" type="text/javascript">
        jwplayer('mediaplayer').setup({
        width: '700',
        height: '396',
        provider: "http",
        file: '../video.mp4',
        image: '../image.jpg', 
        provider: "http"
        });
</script>

This page is now redesigned and should be responsive, with different 3 different wrapper sizes. For each wrapper I need to have a custom width & height in my script, with else if conditions depending on the wrapper showing up.

Something that should look like this?

<script language="" type="text/javascript">
        jwplayer('mediaplayer').setup({
        <?php
                    if ($wrapper == 1340px ) {
                    echo "width='900'";
                    } elseif ($wrapper == 1180px ) {
                    echo "width='700'";  
                    } elseif ($wrapper == 640px ) {
                    echo "width='340'"; 
                    }
                    ?>
        <?php
                    if ($wrapper == 1340px ) {
                    echo "height='500'";
                    } elseif ($wrapper == 1180px ) {
                    echo "height='350'";  
                    } elseif ($wrapper == 640px ) {
                    echo "height='200'"; 
                    }
                    ?>
        provider: "http",
        file: '../video.mp4',
        image: '../image.jpg', 
        provider: "http"
        });
</script>
Lisa Jacobs
  • 53
  • 12
  • cant see any php.. You've a javascript problem... – Bernhard Oct 31 '13 at 16:58
  • This is `pseudo-code`. I suggest you Google conditional statements for JS and PHP and learn how to use them properly. – Funk Forty Niner Oct 31 '13 at 16:59
  • @Fred-ii- is that better? – Lisa Jacobs Oct 31 '13 at 17:22
  • @LisaJacobs Much better. However, how/where are you defining `$wrapper` ? It's better use `@media` using CSS for responsive design. [See this answer on SO](http://stackoverflow.com/a/15794985/1415724) for an example on `@media` – Funk Forty Niner Oct 31 '13 at 17:30
  • well, the point is how should I define `$wrapper` depending on the wrapper that's been selected on the user's screen? (considering I have 3 different CSS files with 3 wrappers) – Lisa Jacobs Oct 31 '13 at 17:34
  • @LisaJacobs It may be easier to check for screen size this way `if(screen.width==1340) { include ('1340.php'); } else{ include ('other.php'); }` --- and [this answer](http://stackoverflow.com/a/15070586/1415724) may help you also. – Funk Forty Niner Oct 31 '13 at 17:48
  • The @media seems an interesting approach but how could the `@media screen and (max-width: ----px)` be correlated to my php condition? – Lisa Jacobs Oct 31 '13 at 18:08
  • @LisaJacobs [See this other answer on SO](http://stackoverflow.com/a/11966695/1415724) and [the question itself](http://stackoverflow.com/q/11966628/1415724) --- However mixing JS and PHP is usually a deadly mix. This may give you a better insight. – Funk Forty Niner Oct 31 '13 at 18:13
  • @LisaJacobs I'm closing this browser tab. If you need to address me directly, please do so by using the `@` symbol followed by my name. I hope what I've given you helped, cheers. – Funk Forty Niner Oct 31 '13 at 18:52
  • ok I found a way in css, thanks to Fred's advices to avoid mixing js with php. it was pretty simple, I just defined a player wrapper with percentages like this: `#mediaplayer_wrapper { width:100% !important; height:100% !important; }` – Lisa Jacobs Nov 14 '13 at 21:43

1 Answers1

0

If you use JW6 responsive design is just built in - http://www.jwplayer.com/blog/new-in-jw-player-responsive-design/

emaxsaun
  • 4,191
  • 2
  • 13
  • 13