[JS] Radio button text align, znów jakiś problem Opcje

[shpaque]

Witam ponownie, teraz mam kolejny schodek. Nie działa text align komendą

[HTML] pobierz, plaintext 
preview.style.align=this.value;
[HTML] pobierz, plaintext 

przy focusie...

[HTML] pobierz, plaintext 
#preview
{
   color: #000000;
   font-size: 13px;
   font-family: Arial;
   font-weight: normal;
   font-style: normal;
   text-align: center;
   text-decoration: none;
   overflow: hidden;
}
[HTML] pobierz, plaintext 

tak wygląda css, a tabelka tak:

[HTML] pobierz, plaintext 
<table style="position:absolute;width:366px;height:150px;overflow:hidden;" id="table">
<tr>
<td style="background-color:#FFFFFF;background-image:url(images/paper.jpg);background-repeat:repeat;background-position:center center;text-align:center;vertical-align:middle;height:150px;"><div id="preview" style="display: inline"></div>
<div id="preview1b" style="display: inline"></div>
<div id="preview2"></div>
<div id="preview3"></div>
<div id="preview4"></div>
<div id="preview5"></div>
<div id="preview6"></div>
<div id="preview7"></div></td>
</tr>
</table>
[HTML] pobierz, plaintext 

może znów nie idzie bo jest w kodzie jQuery?

[nospor]

A od kiedy elementy mają styl ALIGN? Widziales gdzies taki? Bo ja nigdzie.

[shpaque]

ale czego elementy? to styl diva, a css czyta "text-align" czy nie..? Już sam nie wiem

[nospor]

Sam sobie przeczysz i w ogole tego nie widzisz :/

Sam wiesz, ze jest styl TEXT-ALIGN ale w js radosnie przypisujesz sobie ALIGN i wielce zdziwiony ze nie dziala. Nawet jak ci mowie, ze nie ma ALIGN to nadal nie widzisz roznicy miedze
TEXT-ALIGN
ALIGN

.......


Tak w czystym js przypisuje sie styl TEXT-ALIGN a nie ALIGN
http://www.w3schools.com/jsref/prop_style_textalign.asp

[shpaque]

ach o ten babol chodzi że nie "textAlign" tylko samo 'align" - ale to nei w tym rzecz - nie działa - zostało samo align bo już 100 sposoób szukałem zeby to ruszylo

tak więc jest:

[HTML] pobierz, plaintext 
preview.style.textAlign=this.value;
[HTML] pobierz, plaintext 

- takl dla ścisłości - i nie rusza... Dlaczego?

Ten post edytował shpaque 26.11.2013, 14:24:20

[nospor]

To pokaz kod z poprawnym textAlign, co bym wiedzial, ze pracujemy na tym samym kodzie.

No i pokaz gdzie wywolujesz to przypisanie, bo w tym kodzie tego nie widze. Skad mamy wiedizec czemu nie dziala, skoro wyrwales to przypisanie z kontekstu

[shpaque]

[HTML] pobierz, plaintext 
<link href="dark-hive/jquery.ui.all.css" rel="stylesheet" type="text/css">
<link href="MiP_formularz.css" rel="stylesheet" type="text/css">
<style type="text/css">
#table
{
   border: 0px #C0C0C0 none;
   background-color: transparent;
   border-spacing: 0px;
}
#table td
{
   padding: 0px 0px 0px 0px;
}
#table td div
{
   white-space: nowrap;
}
#line1
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#line2
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#line3
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#line4
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#line5
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#line6
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#line7
{
   border: 1px #A9A9A9 solid;
   background-color: #FFFFFF;
   color :#000000;
   font-family: Arial;
   font-size: 13px;
   text-align: left;
   vertical-align: middle;
}
#preview
{
   display: inline;
}
#line1right
{
   position: absolute;
   left: 509px;
   top: 102px;
   z-index: 30;
}
#line1left
{
   position: absolute;
   left: 450px;
   top: 100px;
   z-index: 28;
}
#line1center
{
   position: absolute;
   left: 477px;
   top: 100px;
   z-index: 29;
}
</style>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery.ui.core.min.js"></script>
<script type="text/javascript" src="jquery.ui.widget.min.js"></script>
<script type="text/javascript" src="jquery.ui.button.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
   $("#wielkosc1").button();
   $("#wielkosc2").button();
   $("#wielkosc3").button();
   $("#wielkosc4").button();
   $("#wielkosc5").button();
   $("#line1bold").button();
   $("#line1italic").button();
   $("#line1underline").button();
   $("#print").button();
   $("#line1bbold").button();
   $("#line1bitalic").button();
   $("#line1bunderline").button();
   $("#line2bold").button();
   $("#line2italic").button();
   $("#line2underline").button();
   $("#line3bold").button();
   $("#line3italic").button();
   $("#line3underline").button();
   $("#line4bold").button();
   $("#line4italic").button();
   $("#line4underline").button();
   $("#line5bold").button();
   $("#line5italic").button();
   $("#line5underline").button();
   $("#line6bold").button();
   $("#line6italic").button();
   $("#line6underline").button();
   $("#line7bold").button();
   $("#line7italic").button();
   $("#line7underline").button();
});
</script>
<script>
$(function(){
$('#line1').keyup(function(){
    $('#preview').html($('#line1').val());
});
});
$(function(){
$('#line1b').keyup(function(){
    $('#preview1b').html($('#line1b').val());
});
});
$(function(){
$('#line2').keyup(function(){
    $('#preview2').html($('#line2').val());
});
});
$(function(){
$('#line3').keyup(function(){
    $('#preview3').html($('#line3').val());
});
});
$(function(){
$('#line4').keyup(function(){
    $('#preview4').html($('#line4').val());
});
});
$(function(){
$('#line5').keyup(function(){
    $('#preview5').html($('#line5').val());
});
});
$(function(){
$('#line6').keyup(function(){
    $('#preview6').html($('#line6').val());
});
});
$(function(){
$('#line7').keyup(function(){
    $('#preview7').html($('#line7').val());
});
});
</script>
<style>
#preview
{
   color: #000000;
   font-size: 13px;
   font-family: Arial;
   font-weight: normal;
   font-style: normal;
   text-align: center;
   text-decoration: none;
   overflow: hidden;
}
</style>
</head>
<body>
   <div id="container">
      <div id="wb_form">
         <form name="form" method="post" action="" enctype="multipart/form-data" accept-charset="UTF-8" id="form">
            <input type="radio" id="line1left" onfocus="preview.style.textAlign=this.value;return false;" name="line1" value="left">
            <input type="radio" id="line1center" onfocus="preview.style.textAlign=this.value;return false;" name="line1" value="center" checked="">
            <input type="radio" id="line1right" onfocus="preview.style.textAlign=this.value;return false;" name="line1" value="right">
             <table id="table">
               <tr>
                  <td id="wb_uid42"><div id="preview"></div>
                     <div id="preview1b"></div>
                     <div id="preview2"></div>
                     <div id="preview3"></div>
                     <div id="preview4"></div>
                     <div id="preview5"></div>
                     <div id="preview6"></div>
                     <div id="preview7"></div></td>
               </tr>
            </table>
            <input type="button" id="print" onclick="window.print();return false;" name="print" value="wydrukuj podgląd">
         </form>
      </div>
   </div>
</body>
</html>
[HTML] pobierz, plaintext 

trochę musiałem okroić ale jest

[nospor]

Nigdzie nie widze, bys deklarowal obiekt/zmienną preview wiec niby czemu ma ci dzialac?

Zainteresuj sie FIREBUG dla FIREFOX to tak glupie bledy bedziesz mial podane na tacy.

[shpaque]

196 i 218

[nospor]

Linie co podales to jest kod CSS i HTML ktory ma sie nijak do kodu js, wktorym uzywasz niezdefiniowanej zmiennej preview....

[shpaque]

213-215 - tu jest

[nospor]

Tam jest odwolanie do zmiennej preview, ktorej poraz kolejny ci tlumacze, nigdzie nie zdefiniowales....

[shpaque]

to zapytam tak: dlaczego w całym kodzie wszystko chodzi na poleceniu "onfocus"... i tak dalej analogicznie, a tu muszę definiować zmienną?

całośc do podejrzenia na: http://smusic.nazwa.pl/_test/mip/


na validatorze w3schools dałem taki sam kod:

[HTML] pobierz, plaintext 
<!DOCTYPE html>
<html>
<head>
</head>
<body>
 
<div id="p1">This is some text.</div>
<br>
 
<input type="radio" onfocus="p1.style.textAlign='center'">Align text
 
</body>
</html>
[HTML] pobierz, plaintext 

i wszystko hula jak trzeba i nie trzeba definiować zmiennej

no właśnie i tutaj zaczynają się schody bo z jakiegoś powodu u mnie to nie działa...

JUŻ MAM POSTĘP!
Nie działa tylko w div'ach inline - w takim razie jak można to obejść?

Ten post edytował shpaque 26.11.2013, 19:21:11