Jwplayer doesn't work for me on Internet explorer 8.
It works on all borwsers only ie8.
Here is my code
<div class="player_zone">
<div id="video_0"></div>
<script>
jwplayer_setup("video_0","/multimedias/THX1138.mp4","/multimedias/THXDuvall.jpg");</script>
</div>
<script>
function jwplayer_setup(id,path,img){//
jwplayer(id).setup({//
file: path,
image: img,
width: 'auto',
height:'100%',
advertising: {
client: 'bla',
tag: 'bla bla'
}
});
Of course, everything works fine except in IE, try to upgrade to IE11
Related
The <button> tag seems to mess up Firefox's implentation of Selection.getRangeAt.
Consider the following snippet:
<div>
Hello,
</div>
<button>
A button
</button>
<div>
how are you?
</div>
and this JS:
$(document).bind('cut copy', function() {
let sel = window.getSelection();
let range = sel.getRangeAt(0);
sel.removeAllRanges();
sel.addRange(range);
});
(https://jsfiddle.net/n9r46o5c/18/)
Now, if you select all the text you see, and then copy, it will only have "Hello," selected. Get rid of the button and it works fine. Other browsers work fine. Any ideas?
I found a work-around to what seems to be a Firefox bug. Setting in the CSS:
button { -moz-user-select: text; }
solved it.
I'm creating a simple web app that takes a JSON file which holds an url of 6 images stored inside my folder.
Here is the file: https://api.myjson.com/bins/t3ri9 and I want it using vue js's vue-bind:src to attach each url of each image so that they may be displayed on the browser. Here is the code:
<template>
<div id="main">
<br/><br/>
<h2>Here is a list of all your image</h2>
<br><br>
<div id="images">
<div class="image" v-for="image in pod">
<img v-bind:src="image.url"/>
</div>
</div>
</div>
</template>
<script>
export default {
name: "wall",
data() {
pod: []
},
created() {
this.$http.get('https://api.myjson.com/bins/t3ri9').then(function (data) {
this.pod=data.body;
console.log(this.pod);
});
}
}
</script>
<style scoped>
</style>
However when I run the project on a localhost it doesn't display the images even though when I do to the console it correctly passed the image's url.
this inside the callback is not the same this as outside (in created() {).
Use fat-arrow function to preserve this from the outside:
this.$http.get('https://api.myjson.com/bins/t3ri9').then((data) => {
this.pod=data.body;
console.log(this.pod);
});
Try this
v-bind:src="require('image.url')"
I'm guessing your local images aren't added by webpack?
Maybe try and use the remote location of the image instead.
http://...
I'm using Reveal to show more info and within that there's a carousel using Slick. The content inside the Reveal modal is pulled in via AJAX.
The problem I'm seeing is that when Reveal opens up, the carousel loads without the first image, moves to the second image (where there's a delay in loading), and then works normally after that. Here's a short video as an example: http://cl.ly/323s1T1x3I21
I'm not sure how to get the images to load faster.
My code looks something like the following...
Page code:
<div class="row">
<div class="large-16 columns right">
<h4>...</h4>
<p>... Learn More »</p>
</div>
<div class="large-8 columns left">
...
</div>
Code for page that gets pulled into :
<div class="inner-carousel">
<div><img src="blah..."></div>
<div><img src="blah..."></div>
</div>
<!-- not including this results in slick not working at all -->
<script>
$(document).ready(function() {
$('.inner-carousel').slick({
autoplay: true,
autoplaySpeed: 4000,
arrows: false,
centerMode: true,
dots: true,
fade: true,
speed: 1000,
swipeToSlide: true
});
}); // end ready
</script>
Not sure how to fix. Would appreciate any help.
So JS had to be changed as follows:
$("#modal-vineyard").on("opened", function() {
// $(".inner-carousel").slick("setPosition", 0);
$('.inner-carousel').slick({
setPosition: 0,
autoplay: true,
autoplaySpeed: 4000,
arrows: false,
centerMode: true,
dots: true,
fade: true,
speed: 1000,
swipeToSlide: true
});
});
More info here: http://foundation.zurb.com/forum/posts/23183
I am having a major issue with IE8 and the newest versions (beta) of knockout.js and jquery templates. I keep getting the error below. If I remove the <div> in trialogueRun then it doesn't error. It happens at the buildTmplFn(markup) function in jquery.tmpl.js.
SCRIPT1028: Expected identifier, string or number
jquery.tmpl.js, line 317 character 9
<script id="trialogueRun" type="text/html">
<div data-bind="attr: { class: $data.AgentName }"></div>
</script>
Got it to work with IE8. I should have known IE would have problems with the word 'class'.
<div data-bind="attr: { 'class': $data.AgentName }"></div>
I have issue with one of site that I developing.
Situation is like this:
I'm using #font-face generated at fontsquirrel.com, and in every browser, except for IE8 it works fine. In the beginning it worked for IE8 too, but (I guess) after update it stops working normally.
This is what's happening, after page is loaded, font on the page stays the same until you mouse over the document, after that it applies #font-face rule.
You can see that here: http://devel.2klika.net/fiolic/demo/home.php
Also I'm using fbml on that page for fb:like button, this is the code:
<span style="float: right; position: relative; left: 10px;">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like href="http://www.facebook.com/#!/pages/Mesnice-Fiolic/174173775933578" layout="button_count" show_faces="false" width="50" font="arial"></fb:like>
</span>
I figured that commenting out fb:like is solving, sort of, #font-face problem, like this:
<span style="float: right; position: relative; left: 10px;">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<!-- <fb:like href="http://www.facebook.com/#!/pages/Mesnice-Fiolic/174173775933578" layout="button_count" show_faces="false" width="50" font="arial"> </fb:like> -->
</span>
I would like to use that fb:like button if it is possible to make it work with IE8 and #font-face :)
I tested this with Windows 7 64bit, IE 8.0.7601.17514 64bit and 32bit
If I'm using IE8 in compatibility view it works normally.
Does anyone can help me with this issue?
Thanks in advance
I had found a lot of responses on other forums talking about adding namespaces to the html tag as a way of making this work. I decided to try it my self and with great joy, the like button was displaying in IE8.
I changed my html tag from:
<html>
to:
<html xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/">
As seen in the code I used below:
<html xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/">
<head>
</head>
<body>
<div><fb:like id="fb_like_btn_iframe" show_faces="no" width="220" href="http://www.pixorial.com"></fb:like></div>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
api_key = "<%= FACEBOOK['key'] %>";
FB.init({
appId : api_key,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
var like_clicked = function(href, widget){
$.ajax({
type : "POST",
url : '<%= url_for :controller => :gallery, :action => :update_likes %>',
data : {"url_of_like": href, "type": "like", "authenticity_token": <%= form_authenticity_token.inspect %>}
});
parent.likeButtonChanged(href);
}
var like_unclicked = function(href, widget){
$.ajax({
type : "POST",
url : '<%= url_for :controller => :gallery, :action => :update_likes %>',
data : {"url_of_like": href, "type": "unlike", "authenticity_token": <%= form_authenticity_token.inspect %>}
});
parent.likeButtonChanged(href);
}
$(document).ready(function(){
FB.Event.subscribe('edge.create', like_clicked);
FB.Event.subscribe('edge.remove', like_unclicked);
})
</script>
</body>
</html>
I have encountered the same issue. Quite frustrating as there doesn't seem to be a solution aside from removing the like button from the page.
I've submitted a bug report to facebook for this issue.