Ir para conteúdo / Skip to content

Microsoft interessada em usar Webkit

Postado em: 7 de novembro de 2008 por Pedro Rogério

Webkit

O Inefável Steve Balmer tem se mostrado partidário em desenvolver um Browser de código aberto, isso mesmo, em uma conferência em Sydney, Balmer admitiu que existe a possibilidade de adotar o Webkit(Motor de Renderização do Safari e Google Chrome) para o navegador livre que a Microsoft desenvolveria.

Vejam um trecho de seu discurso:

O código aberto é interessante “, disse ele.” Apple tem utilizado Webkit e poderemos olhar para isso, mas nós vamos continuar a construir extensões para o IE 8.

Só tenho uma coisa a dizer: Balmer, deus lhe ouça. Veja mais sobre o assunto aqui.

Dock estilo MacOS com CSS Animations

Postado em: 14 de maio de 2008 por Pedro Rogério

O dock do MacOS é com certeza é um aparato invejado por todo sistema operacional, surgiram até alguns javacripts caso você quisesse colocar algum menu estilo dock em seu site, mas como o CSS se torna mais poderoso a cada dia, hoje em dia é possível desenvolver menus desse tipo com CSS Animations:


<html>
<head>
	<title>MacOSX Dock CSS Animations
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<style type="text/css">
		#page {	margin-top:10em;}
			.dock li {display:inline;}
			.dock img {width:96px; opacity: 0.7; -webkit-transition: all 1s ease-in;}
			.dock span {position:absolute;top:3em;left:0;opacity:0;-webkit-transition:all 1s ease-out;}
			.dock li:hover img, .dock li:hover span{width:128px;opacity:1;}
			.dock li:hover span {left:50%;}
	</style>
</head>
<body>
	<div id="page">
		<ul class="dock">
			<li><img src="finder.png" alt="Imagen" /><span class="desc">Finder</span></li>
			<li><img src="systempreferences.png" alt="Imagen" /><span class="desc">Preferences</span></li>
			<li><img src="firefox.png" alt="Imagen" /><span class="desc">Firefox</span></li>
			<li><img src="itunes.png" alt="Imagen" /><span class="desc">iTunes</span></li>
			<li><img src="terminal.png" alt="Imagen" /><span class="desc">Terminal</span></li>
			<li><img src="trash.png" alt="Imagen" /><span class="desc">Lixeira</span></li>
		</ul>
	</div>
</body>
</html>

O segredo fica por conta da propriedade -webkit-transition, uma propriedade que somente os usuários dos browsers Safari 3.1 e Webkit podem usufruir. Caso você utilize alguns desses browsers, veja aqui um pequeno exemplo.

Referências

SPINNERET – O Webkit do Windows

Postado em: 29 de fevereiro de 2008 por Pedro Rogério

Aos poucos os melhores browsers estão migrando para o Windows, dessa vez estão tentando rodar o Webkit no windows:

Webkit no Windows
Spinneret

Referências

Webkit irá integrar armazenamento no cliente

Postado em: 4 de janeiro de 2008 por Pedro Rogério

Ícone WebKit

Uma das novidades que o HTML5 promete é a possibilidade de uma base de dados do lado cliente. Por esse motivo, os browsers que queiram seguir esse padrão já devem ir colocando essa funcionalidade em sua lista de pendências, ou então dependerão do Google Gears para essa funcionalidade.

WebKit é o primeiro a dar o passo em relação a isso, depois de implementar o suporte correto a @font-face, agora dão suporte a base de dados com uma API assíncrona para trabalhar com ela. A linguagem escolhida para trabalhar com a base de dados será JavaScript já que está do lado cliente e é a linguagem mais apropriada para isso, usando SQL para interagir com a base de dados.

Exemplo de uso


var database = openDatabase("Database Name", "Database Version");

database.executeSql("SELECT * FROM test", function(result1) {
   // do something with the results
   database.executeSql("DROP TABLE test", function(result2) {
     // do some more stuff
     alert("My second database query finished executing!");
   });
});

WebInspector

Aproveitando que o WebInspector é uma ferrameta muito úil para os desenvolvedores com WebKit, foi criada uma versão modificada para possuir a possibilidade de administrar as bases de dados locais a partir do browser.

WebInspector

Referências

Webkit integra tags HTML5 para suporte multimídia

Postado em: 11 de dezembro de 2007 por Pedro Rogério

Os desenvolvedores do WebKit estão trabalhando para que seu browser tenha suporte as tags HTML5 <audio /> e <video />. O código HTML com a integração de Java Script seria da seguinte forma:

<video />


//HTML
<video src=sample.mov autoplay></video> 

//javascript
<script>
function playPause() {
  var myVideo = document.getElementsByTagName('video')[0];
  if (myVideo.paused)
    myVideo.play();
  else
    myVideo.pause();
}
//Aqui é onde controlamos onde o vídeo termina
myVideo.addEventListener(’ended’, function () {
  alert(’video playback finished’)
} );</script>
<input type=button onclick=”playPause()” value=”Play/Pause”>

<audio />


var audio = new Audio("song.mp3");
audio.play();

Referências

 Página 1 de 1  1