StepCarousel + OpenNewWindow

Citar

Escrito el 24 Nov 2009 03:12 pm

Coloqué en mi página um StepCarousel que funciona bien. Pero cuando mando con otro javascript abrir una nueva ventana con on click en una de las imágenes del carousel este último script no funciona. Ya lo coloqué dentro del head tanto externo como interno, lo coloqué dentro del body abajo del SeepCarouse, lo coloqué adentro de este y de ninguna forma funciona.

Alguna idea de cómo resolver este problema?. Desde ya muchas gracias. Claudio

Por Ishkandar

Claber

303 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email

Citar

Escrito el 25 Nov 2009 06:13 pm

has probado colocarlo como parte del script del StepCarousel??

Por NeoCesar

Claber

1415 de clabLevel

14 tutoriales

Genero:Masculino

Envíale un mensaje privado Email

Algun lugar dentro de la Matrix (Lima - Perú)

@NeoCesar

Citar

Escrito el 25 Nov 2009 07:19 pm

Si ya intenté esto. Quedó así:

Código Javascript :

<script type='text/javascript'>
stepcarousel.setup({
   galleryid: 'mygallery', //id of carousel DIV
   beltclass: 'belt', //class of inner &quot;belt&quot; DIV containing all the panel DIVs
   panelclass: 'panel', //class of panel DIVs each holding content
   panelbehavior: {speed:500, wraparound:true, persist:true},
   defaultbuttons: {enable: true, moveby: 2, leftnav: ['http://web2feel.com/images/rem1.jpg', -14, 60], rightnav: ['http://web2feel.com/images/rem2.jpg', 0, 60]},
   statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
   contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']
})

var win = null;
function NewWindow(mypage,myname,w,h,scroll)
{
   LeftPosition = (screen.width) ? (screen.width-w)/2 : 0;
   TopPosition = (screen.height) ? (screen.height-h)/2 : 0;
   settings = 'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+', scrollbars='+scroll+',resizable'
win = window.open(mypage,myname,settings)
}
</script>

Y tampoco funcionó. Me parece necesário aclarar que este código está dentro del Body.

Claudio

Por Ishkandar

Claber

303 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email

Citar

Escrito el 25 Nov 2009 07:29 pm

seria bueno si mandaras todo el codigo de tu pagina

Por NeoCesar

Claber

1415 de clabLevel

14 tutoriales

Genero:Masculino

Envíale un mensaje privado Email

Algun lugar dentro de la Matrix (Lima - Perú)

@NeoCesar

Citar

Escrito el 25 Nov 2009 09:13 pm

El código abajo.

El javascript está aplicado solamente al primer elemento del step-carousel, desde allí llamo un javascript externo llamado nwindow.js Pero no funciona

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' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
    <b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
<link href='http://pluspixel.com.br/blogger/images/favicon.ico' rel='shortcut icon'/>
     <link href='http://www.pluspixel.com.br/blogger/css/master.css' rel='stylesheet' type='text/css'/>
<!--[if gte IE 6]>
<link rel="stylesheet" type="text/css" href='http://www.pluspixel.com.br/blogger/masterIE6.css' />
<![endif]-->
    <b:skin><![CDATA[]]></b:skin>
<script src='http://www.pluspixel.com.br/blogger/js/jquery.js' type='text/javascript'/>
<script src='http://www.pluspixel.com.br/blogger/js/glide.js' type='text/javascript'/>
<script src='http://www.pluspixel.com.br/blogger/js/tabber.js' type='text/javascript'/>
<script src='http://www.pluspixel.com.br/blogger/js/slider.js' type='text/javascript'/>
<script src='http://www.pluspixel.com.br/blogger/js/nwindow.js' type='text/javascript'/>
<script type='text/javascript'>
<!--//--><![CDATA[//><!--
sfHover = function() {
   var sfEls = document.getElementById("menu").getElementsByTagName("LI");
   var sfEls = document.getElementById("catmenu").getElementsByTagName("LI");
      for (var i=0; i<sfEls.length; i++) {
      sfEls[i].onmouseover=function() {
         this.className+=" sfhover";
      }
      sfEls[i].onmouseout=function() {
         this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
      }
   }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>
</head>
 
<body>
  <!-- Wrapper -->
<div id='wrapper'>

<!-- Top -->
<div id='top'>

<!-- Title -->
<div class='blogname'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Pluspixel (Cabeçalho)' type='Header'/>
</b:section>
</div> 
<!-- /Title -->

<div id='search'>
  <form action='/search' id='searchform' method='get'>
    <input id='s' name='q' type='text' value=''/>
    <input id='searchsubmit' type='submit' value=''/>
  </form>
</div>

</div>
<!-- /Top -->

<!-- Foxmenucontainer -->
<div id='foxmenucontainer'>
  <div id='menu'>
  <ul>
    <li><a expr:href='data:blog.homepageUrl'>Início</a></li>
    <li><a href='#' title='#'>Que fazemos</a></li>
    <li><a href='#' title='#'>Localização</a></li>
    <li><a href='#' title='#'>Contato</a></li>
    <li><a href='#' title='#'>Trabalhe conosco</a></li>
  </ul>
</div>      
</div>
<!-- /Foxmenucontainer -->

<div class='clear'/>



<div class='clear'/>

<!-- Casing -->
<div id='casing'>

<!-- Myslides -->
<div id='myslides'>
<script type='text/javascript'>
stepcarousel.setup({
   galleryid: 'mygallery', //id of carousel DIV
   beltclass: 'belt', //class of inner &quot;belt&quot; DIV containing all the panel DIVs
   panelclass: 'panel', //class of panel DIVs each holding content
   panelbehavior: {speed:500, wraparound:true, persist:true},
   defaultbuttons: {enable: true, moveby: 2, leftnav: ['http://web2feel.com/images/rem1.jpg', -14, 60], rightnav: ['http://web2feel.com/images/rem2.jpg', 0, 60]},
   statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
   contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']
})
</script>

<div class='stepcarousel' id='mygallery'>
<div class='belt'>

<div class='panel'>
<a href='#' onclick='javascript:NewWindow(&apos;http://pluspixel.com.br/blogger/marcas.html&apos;,&apos;name&apos;,&apos;850&apos;,&apos;500&apos;,&apos;yes&apos;) ;return false'><img border='0' height='120' src='http://www.pluspixel.com.br/blogger/images/index_marcas-pearce.gif' width='200'/></a>
</div>

<div class='panel'>
<a href='YOUR-POST-LINK' title='YOUR-POST-TITLE'><img alt='#' height='120' src='http://www.pluspixel.com.br/blogger/images/index_design-helder.gif' width='200'/> </a>
</div>

<div class='panel'>
<a href='YOUR-POST-LINK' title='YOUR-POST-TITLE'><img alt='#' height='120' src='http://www.pluspixel.com.br/blogger/images/index_internet-yvy.gif' width='200'/> </a>
</div>

<div class='panel'>
<a href='YOUR-POST-LINK' title='YOUR-POST-TITLE'><img alt='#' height='120' src='http://www.pluspixel.com.br/blogger/images/index_eventos-beberibe.gif' width='200'/> </a>
</div>

<div class='panel'>
<a href='YOUR-POST-LINK' title='YOUR-POST-TITLE'><img alt='#' height='120' src='http://www.pluspixel.com.br/blogger/images/index_anuncios-calcanhotto.gif' width='200'/> </a>
</div>

<div class='panel'>
<a href='YOUR-POST-LINK' title='YOUR-POST-TITLE'><img alt='#' height='120' src='http://www.pluspixel.com.br/blogger/images/index_tratamento-grafico-ylvis.gif' width='200'/> </a>
</div>

<div class='panel'>
<a href='YOUR-POST-LINK' title='YOUR-POST-TITLE'><img alt='#' height='120' src='http://www.pluspixel.com.br/blogger/images/index_laboratorio.gif' width='200'/> </a>
</div>

</div>
</div>

</div>
<!-- /Myslides -->

<!-- Content -->
<div id='content'>

<b:if cond='data:blog.pageType == &quot;index&quot;'> 
<div class='featout'>
<div class='featured'>
<b:section class='featured' id='featured' showaddelement='no'>
<b:widget id='HTML99' locked='true' title='Novidades' type='HTML'/>
</b:section>
</div>
</div>

<div id='ad1'>
<!-- Google Adsense Code Start -->

<!-- /Google Adsense Code End -->
</div>
</b:if>
      
<!-- Content -->
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Postagens no blog' type='Blog'/>
</b:section>
      
  <!-- Navigation -->
  <div class='pagination'>
  <div class='alignleft'/>
  <div class='alignright'/>
  </div>
  <!-- /Navigation -->
 
<div class='clear'/>

<b:if cond='data:blog.pageType == &quot;index&quot;'> 
<!-- Bottom -->
<div id='bottom'>

<!-- Videopost -->
<div class='videopost'>
<div class='videoposttitle'/>
<div class='videoentry'>
<b:section class='videoentry' id='videoentry' showaddelement='no'>
<b:widget id='HTML90' locked='true' title='video-entry' type='HTML'/>
</b:section>
</div>
</div>
<!-- /Videopost -->

</div>
<!-- /Bottom -->
</b:if>

</div>
<!-- /Content -->

<!-- Rightcol -->
<div id='rightcol'>

<!-- Bottompost -->
<div class='bottompost'>
<div class='tabber'>

<div class='tabbertab'>
<b:section class='tabber3' id='tabber3' showaddelement='yes'>
<b:widget id='Label2' locked='false' title='Tópicos' type='Label'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabber1' id='tabber1' showaddelement='yes'>
<b:widget id='Feed2' locked='false' title='Falcon Hive' type='Feed'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabber2' id='tabber2' showaddelement='yes'>
<b:widget id='LinkList3' locked='false' title='Link Parceiros' type='LinkList'/>
</b:section>
</div>

</div>   
</div>
<!-- /Bottompost -->

<b:if cond='data:blog.pageType == &quot;index&quot;'> 
<!-- Featlist -->
<div class='featlist'>
<div class='highlight'/>

<div class='fblock'>
<b:section class='content98' id='content98' showaddelement='no'>
<b:widget id='HTML98' locked='true' title='' type='HTML'/>
</b:section>
</div>

<div class='fblock'>
<b:section class='content97' id='content97' showaddelement='no'>
<b:widget id='HTML97' locked='true' title='' type='HTML'/>
</b:section>

</div>

<div class='fblock'>
<b:section class='content96' id='content96' showaddelement='no'>
<b:widget id='HTML96' locked='true' title='' type='HTML'/>
</b:section>
</div>

<div class='fblock'>
<b:section class='content95' id='content95' showaddelement='no'>
<b:widget id='HTML95' locked='true' title='' type='HTML'/>
</b:section>
</div>

</div>
<!-- Featlist -->
</b:if>

<div class='clear'/>

<!-- Banner -->
<b:if cond='data:blog.pageType == &quot;index&quot;'>  
<div class='bannerhead'/>
<div class='banner'>
<div class='banner1 section' id='banner1'><div class='widget HTML' id='HTML84'>
<div class='widget-content'>
<a href='http://themeforest.net/?ref=alvaris' rel='bookmark' title=''><img alt='' src='http://i268.photobucket.com/albums/jj5/alvaris/TF_125x125.jpg'/></a>
<a href='http://themeforest.net/?ref=alvaris' rel='bookmark' title=''><img alt='' src='http://i268.photobucket.com/albums/jj5/alvaris/TF_125x125.jpg'/></a>   
<a href='http://themeforest.net/?ref=alvaris' rel='bookmark' title=''><img alt='' src='http://i268.photobucket.com/albums/jj5/alvaris/TF_125x125.jpg'/></a>
<a href='http://themeforest.net/?ref=alvaris' rel='bookmark' title=''><img alt='' src='http://i268.photobucket.com/albums/jj5/alvaris/TF_125x125.jpg'/></a>
</div>
</div></div>
</div>
</b:if> 
<!-- /Banner -->

<!-- Sidebar -->
<div id='sidebar'>

<b:section class='sidebar2' id='sidebar2' preferred='yes'/>

<b:section class='sidebar1' id='sidebar1' preferred='yes'/>

</div>
<!-- /Sidebar -->

</div>
<!-- /Rightcol -->

<div class='clear'/>

</div>
<!-- /Casing -->

<!-- Zinmag Remedy Blogger Template comes under a Creative Commons License. 
This means it is free to use on your blog as long as the credit link in the footer is kept intact 
FalconHive.com
-->

<!-- Footer -->   
<div id='footer'>

© Copyright <a expr:href='data:blog.homepageUrl'><data:blog.title/></a>

</div>
<!-- /Footer -->

</div>
<!-- /Wrapper -->

</body></html>

Por Ishkandar

Claber

303 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email

Citar

Escrito el 25 Nov 2009 09:20 pm

ya probe el sript y por algun motivo stepcarousel bloquea las acciones click, la unica forma que encontre de hacerlo es incluyendo la accion en la misma etiqueta es decir

Código HTML :

<div class="panel" onClick="javascript:alert('hola mundo');">

Por ahora no veo otra solucion, pero si la encuentro te aviso.

Por NeoCesar

Claber

1415 de clabLevel

14 tutoriales

Genero:Masculino

Envíale un mensaje privado Email

Algun lugar dentro de la Matrix (Lima - Perú)

@NeoCesar

Citar

Escrito el 25 Nov 2009 11:06 pm

Gracias amigo por tu tiempo y tu solución. Sino consigo encontrar otra solución en breve o coloco inline, como en tu solución o coloco ese stepcarousel em Flash. Que te parece?

Por Ishkandar

Claber

303 de clabLevel

Genero:Masculino

Envíale un mensaje privado Email

StepCarousel + OpenNewWindow

Escribe una respuesta rapida