Jquery Corners

opzina · #1 (**permalink**) 03/05/2009, 12:30

Hola, alguien podria explicarme como aplicar jquery corners a mis divs?

He seguido varias tutoriales, pero ninguna me da el efecto, no se que falla.

este es el codigo que manejo actualmente pero no hay caso:

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&iacute;tulo</title>

<script type="text/javascript" src="js/jquery.corners.js"></script>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script>$(document).ready( function(){
  $('.redondas').corners();});
</script>
</head>

<body>
<div style="background-color:#0033CC; width:400px; color:#CCFF66; class="redondas">
	Contenedor con esquinas redondeadas.
</div>
</body>
</html>

y estos los archivos js:

jquery corners
jquery

saludos

chalchis · #2 (**permalink**) 03/05/2009, 15:02

pues no carga tus links
pero encontre uno checalo ahi dice como usarlo

http://www.atblabs.com/jquery.corners.html

saludos

opzina · #3 (**permalink**) 03/05/2009, 15:07

no carga los links porque no le puse la extension... ".js", ahi los corregi

ahora miro tu posteo,
gracias.

opzina · #4 (**permalink**) 03/05/2009, 15:18

igual esa pagina que me mostras ya le he visitado y no hay caso, tampoco me funciona....algo mal estoy haciendo...

mira este ejemplo lo hice con el link que me pasaste:

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&iacute;tulo</title>


<script type="text/javascript" src="jquery.corners.js"></script>
</head>

<body>
<div style="background-color:#acc; padding:10px" class="rounded {10px}">
  class="rounded {10px}"
</div>
<script>$(document).ready( function(){
  $('.rounded').corners("4px");
});</script></div>
</body>
</html>

chalchis · #5 (**permalink**) 03/05/2009, 15:23

por lo que veo necesitas tambien el jquery.js

opzina · #6 (**permalink**) 03/05/2009, 15:26

cargue el jquery al head y tampoco funciona:

Código HTML:

<script type="text/javascript" src="jquery-1.3.2.js"></script>

asi:

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&iacute;tulo</title>


<script type="text/javascript" src="jquery.corners.js"></script>
<script type="text/javascript" src="jquery-1.3.2.js"></script>

</head>

<body>
<div style="background-color:#acc; padding:10px" class="rounded {10px}">
  class="rounded {10px}"
</div>
<script>$(document).ready( function(){
  $('.rounded').corners("4px");
});</script></div>
</body>
</html>

#7 (**permalink**) 03/05/2009, 16:08

Primero cargas la librería jquery y después cargas los plugins. Es decir, que en este caso primero tienes que cargar el jquery.js y después del jquery.corners.js.

opzina · #8 (**permalink**) 03/05/2009, 16:40

o sea tengo que invertir el codigo? uno antes y despues el otro?..

opzina · #9 (**permalink**) 03/05/2009, 16:41

gracias ahi funciona.

saludos.

opzina · #10 (**permalink**) 03/05/2009, 17:03

En firefox 3 funciona pero en IE7 no...y en la pagina oficial dice que soporta IE6+, pero no me funciona...cual puede ser el problema ahora?..un probema de encuadre?

#11 (**permalink**) 04/05/2009, 01:49

El ejemplo/tutorial que han puesto ahí arriba, funciona en IE7. Así que debe serr tu código.

Pon tu código entero tal cual lo tienes ahora.

caricatos · #12 (**permalink**) 04/05/2009, 02:15

Hola:

Movemos el tema al subforo Frameworks desde javascript.

Saludos