Google Fonts & Safari SELECT problem
I have a problem with select when I import fonts from Google Fonts. When I click on select on Safari, webs开发者_Go百科ite reloads. On Chrome, FF, IE everything is ok. Example:
http://jsfiddle.net/stcvS/
Can anyone help?
You can target Safari via CSS and avoid the problem:
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* for Safari 5.1 bug http://stackoverflow.com/questions/7025826/google-fonts-safari-select-problem */
.formData SELECT {
font-family:Helvetica, arial, sans-serif;
}
}
I'm not sure if JQuery is a route you want to go down, but perhaps this could help:
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
</head>
<body>
<select id="dropdown">
<option>kiko</option>
<option>atletico</option>
</select>
<script>
jQuery(document).ready(function($){
$("#dropdown").click(function(event) {
event.preventDefault();
});
});
</script>
This seems to be a bug in Safari 5.1. Every SELECT with CSS @font-face fails with page reload.
It's better to user <ul></ul> or <ol></ol> and apply necessary css and javascript insted of using <select></select> in this type of special case where we have to apply different font-familiy , font-style, etc.
加载中,请稍侯......
精彩评论