Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Shoutbox wielkość
DreqX
post
Post #1





Grupa: Zarejestrowani
Postów: 44
Pomógł: 0
Dołączył: 12.08.2009

Ostrzeżenie: (0%)
-----

Witam,
Pobrałem ostatnio ciekawego Shoutbox-a w Ajax-ie i chciałbym zrobić stałą długość. Index.php wygląda tak: (podałem go, bo on ma szerokość)
Kod
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title>jQuery</title>
  <style type="text/css">
    #daddy-shoutbox {
      padding: 5px;
      background: #3E5468;
      color: white;
      width: 600px;
      font-family: Arial,Helvetica,sans-serif;
      font-size: 11px;
    }
    .shoutbox-list {
      border-bottom: 1px solid #627C98;
      
      padding: 5px;
      display: none;
    }
    #daddy-shoutbox-list {
      text-align: left;
      margin: 0px auto;
    }
    #daddy-shoutbox-form {
      text-align: left;
      
    }
    .shoutbox-list-time {
      color: #8DA2B4;
    }
    .shoutbox-list-nick {
      margin-left: 5px;
      font-weight: bold;
    }
    .shoutbox-list-message {
      margin-left: 5px;
    }
    
  </style>
  <script type="text/javascript" src="js/jquery.js"></script>
  <script type="text/javascript" src="js/jquery.form.js"></script>
</head>
  <body>

  <center>
  <div id="daddy-shoutbox">
    <div id="daddy-shoutbox-list"></div>
    <br />
    <form id="daddy-shoutbox-form" action="demos/jquery-shoutbox/daddy-shoutbox.php?action=add" method="post">
    Nick: <input type="text" name="nickname" /> Say: <input type="text" name="message" />
    <input type="submit" value="Submit" />
    <span id="daddy-shoutbox-response"></span>
    </form>
  </div>
  </center>
  
  <script type="text/javascript">
        var count = 0;
        var files = 'demos/jquery-shoutbox/';
        var lastTime = 0;
        
        function prepare(response) {
          var d = new Date();
          count++;
          d.setTime(response.time*1000);
          var mytime = d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();
          var string = '<div class="shoutbox-list" id="list-'+count+'">'
              + '<span class="shoutbox-list-time">'+mytime+'</span>'
              + '<span class="shoutbox-list-nick">'+response.nickname+':</span>'
              + '<span class="shoutbox-list-message">'+response.message+'</span>'
              +'</div>';
          
          return string;
        }
        
        function success(response, status)  {
          if(status == 'success') {
            lastTime = response.time;
            $('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
            $('#daddy-shoutbox-list').append(prepare(response));
            $('input[@name=message]').attr('value', '').focus();
            $('#list-'+count).fadeIn('slow');
            timeoutID = setTimeout(refresh, 3000);
          }
        }
        
        function validate(formData, jqForm, options) {
          for (var i=0; i < formData.length; i++) {
              if (!formData[i].value) {
                  alert('Please fill in all the fields');
                  $('input[@name='+formData[i].name+']').css('background', 'red');
                  return false;
              }
          }
          $('#daddy-shoutbox-response').html('<img src="'+files+'images/loader.gif" />');
          clearTimeout(timeoutID);
        }

        function refresh() {
          $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
            if(json.length) {
              for(i=0; i < json.length; i++) {
                $('#daddy-shoutbox-list').append(prepare(json[i]));
                $('#list-' + count).fadeIn('slow');
              }
              var j = i-1;
              lastTime = json[j].time;
            }
            //alert(lastTime);
          });
          timeoutID = setTimeout(refresh, 3000);
        }
        
        // wait for the DOM to be loaded
        $(document).ready(function() {
            var options = {
              dataType:       'json',
              beforeSubmit:   validate,
              success:        success
            };
            $('#daddy-shoutbox-form').ajaxForm(options);
            timeoutID = setTimeout(refresh, 100);
        });
  </script>
</body>
</html>

Pomyślałem, żeby pod width: 600px; dodać height: 300px; no i dodałem. Gdy wszedłem na stronę, sb miał rzeczywiście 300px, ale jak zacząłem dodawać wiadomości to on się wydłużał. Żeby powrócić do 300px musiałem odświeżyć stronę. Jak zrobić, aby stała długość sb to była 300px, nawet jak będę dodawał nowe wpisy? Jeżeli trzeba dam inne pliki tego sb.
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
Lwie_Serce_
post
Post #2





Grupa: Zarejestrowani
Postów: 38
Pomógł: 0
Dołączył: 2.12.2004
Skąd: Tarnów

Ostrzeżenie: (10%)
X----

nospor probowałem to już przenosić w różne miejsca i nie działa dalej tak jak powinno (IMG:style_emoticons/default/sad.gif) tylko pasek jest ciągle na dole wtedy gdy rozmawiamy na czacie.
Ale jak wejde na czat to pasek jest na gorze i musze przesunać go w dół.
Kombinowałem tak:
Kod
var adminNickName = 'NorthAngel';
var count = 0;
var files = '/shoutbox/';
var lastTime = 0;
var a = document.getElementById('daddy-shoutbox-list');
a.scrollTop = a.scrollHeight;

Próbowałem też tak:
Kod
var a = document.getElementById('daddy-shoutbox-list');
a.scrollTop = a.scrollHeight;
function refresh() {
    $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
        if(json.length) {
            for(i=0; i < json.length; i++) {
                $('#daddy-shoutbox-list').append(prepare(json[i],  $('#daddy-shoutbox-list').children().length));
                $('#list-' + count).fadeIn('slow');
            }
            var j = i-1;
            lastTime = json[j].time;
        }
        //alert(lastTime);
    });
    timeoutID = setTimeout(refresh, 3000);
}

Próbowałem nawet tak:
Kod
function refresh() {
    $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
        if(json.length) {
            for(i=0; i < json.length; i++) {
                $('#daddy-shoutbox-list').append(prepare(json[i],  $('#daddy-shoutbox-list').children().length));
                $('#list-' + count).fadeIn('slow');
            }
            var j = i-1;
            lastTime = json[j].time;
        }
        //alert(lastTime);
    });
var a = document.getElementById('daddy-shoutbox-list');
a.scrollTop = a.scrollHeight;
    timeoutID = setTimeout(refresh, 3000);
}

Nawet tak też próbowałem :
Kod
function success(response, status)  {
    if(status == 'success') {
        lastTime = response.time;
        $('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
        $('#daddy-shoutbox-list').append(prepare(response, $('#daddy-shoutbox-list').children().length));
        $('input[@name=message]').attr('value', '').focus();
        $('#list-'+count).fadeIn('slow');

var a = document.getElementById('daddy-shoutbox-list');
a.scrollTop = a.scrollHeight;

        timeoutID = setTimeout(refresh, 3000);
    }

I dalej nic (IMG:style_emoticons/default/sad.gif) Pasek jest tylko na dole wtedy gdy rozmawiamy na czacie. A jak się wejdzie na czat to jest na gorze.
Możesz mi jakoś pomóc żeby mi to wreszcie zadziałało tak jak ma być (IMG:style_emoticons/default/sad.gif)

Obecnie mam zrobione tak:
W pliku style.css
Kod
function success(response, status)  {
    if(status == 'success') {
        lastTime = response.time;
        $('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
        $('#daddy-shoutbox-list').append(prepare(response, $('#daddy-shoutbox-list').children().length));
        $('input[@name=message]').attr('value', '').focus();
        $('#list-'+count).fadeIn('slow');

    var a = document.getElementById('daddy-shoutbox-list');
        a.scrollTop = a.scrollHeight;

        timeoutID = setTimeout(refresh, 3000);
    }
}

Prosze Cię pomoż mi (IMG:style_emoticons/default/sad.gif)

Pomoze mi ktos czy nie (IMG:style_emoticons/default/questionmark.gif) (IMG:style_emoticons/default/questionmark.gif) (IMG:style_emoticons/default/questionmark.gif) (IMG:style_emoticons/default/questionmark.gif) (IMG:style_emoticons/default/questionmark.gif) ?/

Czy ktos moze mi pomoc z tym czatem czy nie ? nospor licze na ciebie bo to tylko Ty wiesz. Prosze pomoz mi (IMG:style_emoticons/default/sad.gif)
Go to the top of the page
+Quote Post

Posty w temacie
- DreqX   Shoutbox wielkość   13.10.2009, 20:49:27
- - jmail   max-height w css   13.10.2009, 21:40:35
- - DreqX   Nie nie pomogło, dalej tak się robi.   13.10.2009, 21:47:05
- - jmail   a pokaż to co jest zwracane do ajax'a przez ph...   13.10.2009, 21:53:27
- - nospor   U mnie na stronie masz shoutbox. By była stała dłu...   13.10.2009, 21:58:18
- - DreqX   nospor, ok dzięki działa A jak zrobić aby scroll ...   13.10.2009, 22:07:02
- - nospor   obj.scrollTop = obj.scrollHeight; gdzie obj to obi...   13.10.2009, 22:15:48
- - DreqX   Dałem daddy-shoutbox.scrollTop = daddy-shoutbox.sc...   13.10.2009, 22:24:22
- - nospor   a czy daddy-shoutbox jest obiektem DOM? Czy moze t...   14.10.2009, 06:24:33
- - Lwie_Serce_   Hej, właśnie też mam tego shoutboxa i nie moge sob...   6.03.2013, 15:38:41
- - nospor   Po zaladowaniu czata masz wywolac o to: var a = d...   6.03.2013, 20:04:12
- - Lwie_Serce_   nospor ale ten kod który pokazałeś mam już dodany ...   6.03.2013, 20:25:53
- - nospor   Skoro podczas rozmowy pasek ciągle jest na dole, z...   7.03.2013, 07:47:42
- - Lwie_Serce_   nospor probowałem to już przenosić w różne miejsca...   10.03.2013, 01:21:17

« Następny starszy · AJAX · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 27.12.2025 - 13:09
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn