¡FUNCIONA! Luchando contra mi torpeza e ignorancia infinitas en estas lides, he fusionado tu última solución con el primer código que puse. Se muestra y oculta con movimiento slide suave a la par que elegante y el mapa aparece centrado con el bocadillo de la marca abierto.
He tenido que aplicarle unas milésimas de segundo para que apareciera centrado: con 0 milisegundos aparecía descentrado; con unos 400 aparece centrado y sin el bocadillo; y con unos 2500 ya aparece el bocadillo. Esto a efectos visuales da igual (salvo en mi IE7, pero no es tan grave) pq no hace falta esperar tanto tiempo para desplegarlo y que se muestre bien. En FF, Safari y Chrome de lujo.
Como sospechabas, el código
$('#map').ready() dentro del document.ready() lo he suprimido pq funciona igual sin él.
Eternamente agradecido. Da gusto contar con estos foros y una gente tan solidaria. Adunto el código final:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script>
$(document).ready(function(){
$('#mapa').slideUp(2500);
document.getElementById('mapa').innerHTML = '<iframe width="640" height="480" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.es/maps?f=q&source=s_q&hl=es&geocode=&q=Puerta+del+Sol,+Madrid&aq=3&sll=40.396764,-3.713379&sspn=8.59894,19.753418&ie=UTF8&hq=&hnear=Puerta+del+Sol,+PLAZA+Puerta+DEL+SOL,+14,+28013+Madrid,+Comunidad+de+Madrid&ll=40.422906,-3.703423&spn=0.031364,0.054932&z=14&iwloc=A&output=embed"></iframe>';
$('#botonmostrarocultar').show(800);
});
</script>
<script type="text/javascript">
$(function() {
$("#mostrar").click(function(event){
event.preventDefault();
$("#mapa").slideToggle(1500); });
$("#mapa a").click(function(event) {
event.preventDefault();
$("#mapa").slideUp(); });
});
</script>
<style type="text/css">
<!--
body {
background-color: #000;
color: #FFF;
}
#botonmostrarocultar {
display: none;
color: #000;
background-color: #FFC;
width: 300px;
}
#texto {
display: none;
}
-->
</style></head>
<body>
<div id="botonmostrarocultar"><a href="#" id="mostrar">Mostrar/Ocultar MAPA DIV</a></div>
<div id="mapa"></div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien. Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper eu, fringilla at, lacinia ut, augue. Nullam nunc.</p>
<p>Sed et lectus in massa imperdiet tincidunt. Praesent neque tortor, sollicitudin non, euismod a, adipiscing a, est. Mauris diam metus, varius nec, faucibus at, faucibus sollicitudin, lectus. Nam posuere felis ac urna. Vestibulum tempor vestibulum urna. Nullam metus. Vivamus ac purus. Nullam interdum ullamcorper libero. Morbi vehicula imperdiet justo. Etiam mollis fringilla ante. Donec et dui. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Etiam mi libero, luctus nec, blandit ac, rutrum ac, lectus.</p>
<p>Morbi consequat felis vitae enim. Nunc nec lacus. Vestibulum odio. Morbi egestas, urna et mollis bibendum, enim tellus posuere justo, eget elementum purus urna nec lacus. Nullam in nulla. Praesent ac lorem. Donec metus risus, accumsan ut, mollis non, porttitor eget, mi. Aliquam aliquet, tortor a elementum aliquam, erat odio sodales eros, suscipit blandit lectus dolor sit amet elit. In eros wisi, mollis vitae, tincidunt in, suscipit id, nibh. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Phasellus ornare. Suspendisse potenti. Mauris convallis. Vestibulum nec mauris in augue porta mollis. Proin ut nunc. Mauris aliquam dui eget purus.</p>
</body>
</html>