Help
If I run IE9 in "Compatibility mode" (AKA IE7 mode), then the FB Javascript runs but my CSS layout is broken.
DO you have any advice on how to solve this?
Here is my code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY APP TITLE</title>
<link rel="stylesheet" type="text/css" href="my_CSS.css" />
</head>
<body>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script src="src/jquery-ui-1.8.13.custom/js/jquery-1.5.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="src/jquery-autocomplete/lib/jquery.bgiframe.min.js"></script>
<script type="text/javascript" src="src/dimensions-1.1.2/jquery.dimensions.js"></script>
<script type="text/javascript" src="src/jquery-autocomplete/jquery.autocomplete.js"></script>
<script type="text/javascript">
// Launches document code on Document Ready
$(document).ready(function(){
FB.api("/me/friends?fields=name,picture,id", handleFriends);
function handleFriends(response) {
var divInfo = document.getElementById("divInfo");
var friends = response.data;
// Store to array
var amigos = new Array();
for (var i=0; i<friends.length; i++) {
amigos[i] = friends[i].name;
}
console.log("DONE LOADING FRIENDS INTO ARRAY");
console.log(amigos[0]);
$("#nombreVotado").autocomplete(amigos);
}
});
</script>
<noscript>Your browser does not support Javascript!</noscript>
<!-- BEGIN HTML CODE -->
<input type="hidden" id="contadorInvisible" value="1" />
<div id="wrap">
<div id="header"><img src="img/ETCYLP_BANNER.jpg" width="650" height="69" alt="Banner"></div>
<div id="nav">
<ul>
<li>Categoría: </li>
<li><label id="catNo">1/20 </label></li>
</ul>
</div>
<div id="main">
<img src="img/cat1.jpg" alt="Category Logo" width="150" height="200" id="categoryLogo" />
</div>
<div id="sidebar">
<h2><label id="catNombre">Nombre de Categoria</label></h2>
<p><label id="catDescripcion">Description de Categoria</label></p>
<br /><br />
<p>Tu Voto: <input type="text" id="nombreVotado" /></p>
<br /><br /><br /><br />
<input type="submit" id="submitVoto" value="Siguiente Categoría >>" onClick="cambiaCategoria(nombreVotado.value)"/>
<!--</form>-->
</div>
<div id="footer">
<img src="img/votoFooter.jpg" width="650" height="63" alt="Vota o..." />
</div>
</div>
<div id="fb-root">
<script src="http://connect.facebook.net/en_US/all.js"></script>
</div>
<script>
FB.init({
appId : 'XXXXXXXXXXXXXXX',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.api('/me', function(response) {
console.log("user id: " + response.id);
});
</script>
</body>
</html>
