Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: Добавить форму которая будет добавлять данные в массив.

Помогите пожалуйста. Нужно добавить на страницу форму, которая будет добавлять данные в массив. Скидываю всё что есть вместе с сортировкой.
<html>
<head>
<title>Сортировка таблицы средствами JavaScript</title>
<link href="css/styl.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-type" content="text/html; charset=Windows-1251">
<script language="JavaScript" type="text/javascript">
var txt = [];
var flag;
var sorted;

function weight( str ) {
var retArray = [];

for( var i = 0; i < str.length; i++ ) {
var tmp = str.charCodeAt( i );
if( tmp >= 1046 && tmp < 1078 )
tmp++;
else if( tmp == 1025 )
tmp = 1046;
else if( tmp >= 1078 )
tmp++;
else if( tmp == 1105 )
tmp = 1078;
retArray[ i ] = tmp;
}

return retArray;
}

function fillArray( years, books, authors ) {
this.years = years;
this.yweight = weight( years );
this.books = books;
this.bweight = weight( books );
this.authors = authors;
this.aweight = weight( authors );
}

function isLow( low, high, type ) {
var len1 = low[ type ].length;
var len2 = high[ type ].length;
var length = len1 < len2 ? len1 : len2;

for( var i = 0; i < length; i++ ) {
var str1 = low[ type ][ i ];
var str2 = high[ type ][ i ];
if( str1 < str2 )
return true;
if( str1 > str2 )
return false;
}

if( len1 < len2 )
return true;
return false;
}

function quickSort( l, h, type ) {
var low = l;
var high = h;
var rt = eval( "txt[ " + Math.round( ( l + h ) / 2 ) + " ]" );
var middle = new fillArray( rt.years, rt.books, rt.authors );

do {

while( isLow( eval( "txt[ " + low + " ]" ), middle, type ) )
low++;

while( isLow( middle, eval( "txt[ " + high + " ]" ), type ) )
high--;

if( low <= high ) {
var temp = txt[ low ];
txt[ low++ ] = txt[ high ]
txt[ high-- ] = temp;
}
} while( low <= high );

if( l < high )
quickSort( l, high, type );
if( low < h )
quickSort( low, h, type );
}

txt[ 0 ] = new fillArray( "Crypto ++ SDK 3.0", "Copyright © 1997-1999 Sampson Multimedia.", "1997" );
txt[ 1 ] = new fillArray( "Gus", "Gus Communications, Inc.", "2004" );
txt[ 2 ] = new fillArray( "CripKey", "Kenonic Controls Ltd.", "2010" );
txt[ 3 ] = new fillArray( "Microcosm Copy Protection", "Microcosm Copy Protection", "1996" );
txt[ 4 ] = new fillArray( "Dinkey Dongles", "Dinkey Dongles", "2003" );
txt[ 5 ] = new fillArray( "PC Guard", "Copyright © by Blagoje Ceklic", "1998" );
txt[ 6 ] = new fillArray( "SafeSerial OCX для Windows 95, 98, NT, 2000", "Sikander Soft Inc.", "1995" );
txt[ 7 ] = new fillArray( "Wibu — Key", "©1999 Copy-Protection.com.", "1999" );
txt[ 8 ] = new fillArray( "Lock & Key", "Timeless Technologies, Inc.", "2009" );
txt[ 9 ] = new fillArray( "Windows Protection Tool-Kit", "Advanced Software Technologies", "2006" );
txt[ 10 ] = new fillArray( "Hardlock Bistro", "Aladdin Knowledge Systems GmbH & Co.", "2007" );
txt[ 11 ] = new fillArray( "Sheriff", "Acudata Limited", "2002" );


function createTable( cStart, cType, cSize, cChange ) {
var tabbd = document.getElementById( "tablebody" );

if( !tabbd ) {
var table = document.getElementById( "table" );
var tbody = document.createElement( "tbody" );
tbody.id = "tablebody";
table.appendChild( tbody );
tabbd = document.getElementById( "tablebody" );
}

while( tabbd.hasChildNodes() ) {
var tmp = tabbd.childNodes[ 0 ];
tabbd.removeChild( tmp );
}


for( var counter = cStart; eval( counter + cType + cSize ); eval( "counter" + cChange ) ) {
var tr = document.createElement( "tr" );

var td = document.createElement( "td" );
var tdtxt = document.createTextNode( txt[ counter ].years );
td.appendChild( tdtxt );
tr.appendChild( td );
td = document.createElement( "td" );
tdtxt = document.createTextNode( txt[ counter ].books );
td.appendChild( tdtxt );
tr.appendChild( td );
td = document.createElement( "td" );
tdtxt = document.createTextNode( txt[ counter ].authors );
td.appendChild( tdtxt );
tr.appendChild( td );
tabbd.appendChild( tr );
}
}

function allocator( arg ) {

if( flag == arg ) {
if( sorted == "up" ) {
createTable( 0, "<", txt.length, "++" );
sorted = "down";
} else {
createTable( txt.length - 1, ">=", 0, "--" );
sorted = "up";
}
return;
}

quickSort( 0, txt.length - 1, arg );
createTable( 0, "<", txt.length, "++" );
flag = arg;
}
/script>
</head>
<body>
<div id="page-wrap">
<table border="1" id="table">
<tr>
<td><a href="javascript:allocator( 'yweight' )">Программа</a></td>
<td><a href="javascript:allocator( 'bweight' )">Разработчик</a></td>
<td><a href="javascript:allocator( 'aweight' )">Год создания</a></td>
</tr>
<tbody id="tablebody"></tbody>
</table>
<
<input type="button" onclick="UserList" value="Добавить"/>

<script language="JavaScript" type="text/javascript">
createTable( 0, "<", txt.length, "++" );
</script>
</div>
</body>
</html>
Ответ: рони,То есть добавленную информацию я не как не сохраню?
Вопрос: Создание плагина на jQuery, который будет добавлять в поля ввода крестик, при клике на который будет очищаться значение.

Написать плагин, который будет добавлять в input и textarea крестик, при клике на который будет очищаться текущее поле (сразу проверьте и подумайте как сделать так, чтобы текст внутри поля не налез на крестик).

В идеале,если другой человек подключает у себя js и css файлы, мог вызвать любой элемент с плагином, например $('input').clearz();

Еще нужно принимать параметр и, в зависимости от него, показывать крестик слева или справа.
Ответ: Готов вот такой вот код,но проблема в том ,что он стирает информацию только в одном инпуте,если добавить ещё один,то ничего не происходит.Помогите разобраться.Крестик стирания не отображается,не знаю как его залить(он отдельной картинкой в проэкте идет).
PHPHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <title>Home work 15</title>
   
    <style>
        body {
    font-family: Arial, sans-serif;
}
 
.goHome {
    font-size: 10pt;
    margin: 10px 5px;
}
 
.inputWrapper {
    margin: auto;
    width: 260px;
    margin-top: 100px;
}
 
input#searchInput {
    width: 230px;
    outline: none;
    border: solid 1px Silver;
    height: 16px;
    line-height: 16px;
    padding: 1px;
    margin: 0;
    padding-right: 20px;
}
 
.x {
    width: 10px;
    height: 10px;
    margin-left: -15px;
    cursor: pointer;
}
    </style>
</head>
 
<body>
    <div class="inputWrapper">
        <input id="searchInput" type="text" />
    </div>
 
 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
    <script src="main.js"></script>
 
    <script type="text/javascript">
        $(document).ready(function() {
            $('#searchInput').AddXbutton({
                img: 'images/x.gif'
            });
            $('#searchInput').focus();
        });
    </script>
</body>
 
</html>
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
(function($) {
    $.fn.AddXbutton = function(options) {
        var defaults = {
            img: 'x.gif' //расположение картинки крестика по-умолчанию (относительно страницы, на которой находится инпут)
        };
        var opts = $.extend(defaults, options);
        $(this)
            .after($('<input type="image" id="xButton" src="' + opts['img'] + '" />') //после текстового инпута вставляем image-input
                .css({
                    'display': 'none',
                    'cursor': 'pointer',
                    'marginLeft': '-15px'
                }) // делаем его стильным
                .click(function() { //вешаем обработчик на клик
                    $('#searchInput').val('').focus();
                    $('#xButton').hide();
                }))
            .keyup(function() { //на кейап мы проверяем, показывать нам крестик или нет
                if ($(this).val().length > 0) {
                    $('#xButton').show(); //если текст какой-нибудь есть, но показываем
                } else {
                    $('#xButton').hide();
                }
            });
        if ($(this).val() != '') $('#xButton').show(); //если при загрузке страницы в текстовом поле что-то есть, крестик надо сразу показать (например, при обновлении страницы)
    };
})(jQuery);
Вопрос: Создать HTML форму, которая будет содержать следующие элементы

Создать HTML форму, которая будет содержать следующие элементы:
-текстовое поле для вода телефона. При снятии фокуса поля проверять по маске +7(123)123-12-12, если не соответствует то выводить сообщение.
-кнопка при нажатии на которую она удаляется и на ее месте появляются 2 другие кнопки с таким же реагированием при нажатии.
-поле для загрузки файла с плюсиком и минусом. При нажатии на плюсик появляется дополнительное аналогичное поле (с плюсом и минусом)после данного поля. При нажатии на минус поле удаляется.
-сабмит формы позволять только при правильно заполненном телефоне и минимум двух выбранных картинках.
Ответ: Я сделал очень мало потому что не понимаю пока многого но только учусь а сдавать уже в понедельник(((
PHPHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<DOCTYPE HTML!>
<html>
<head>
<meta charset="UTF-8"/>
<title>WE are teach JS</title>
</head>
<body>
<script type="text/javascript">
 
        function buttonStatus() {
            if(document.getElementById('p10').style.display == 'none') {
                document.getElementById('p10').style.display='block';
            } else {
                document.getElementById('p10').style.display='none';
            }
        }
    </script>
 
    <input type="button" value="Click me" onClick="buttonStatus()";
 
    <div id="p10">
    <form>
  <button>Первая кнопка</button>
</form>
 
    <form>
  <button>Вторая кнопка</button>
</form>
</div>
 
</body>
</html>
Добавлено через 1 минуту
Вообщем пока более менее второе задание получается и то на половину где надо нажимать на кнопочку и из нее становилось две. А как что бы при этом исчезала она сама опять не получается=(((

Добавлено через 35 секунд
Вообщем завал если не очень сложно не могли бы помочь?
Вопрос: Как и на чём создать плагин для оперы, который будет перехватывать открываемые страницы

Здраствуйте! Я хочу создать для оперы плагин, который будет перехватывать открываемые страницы. Плагинами занимаюсь впервые, и хотел бы узнать как и на чём их пишут.
Ответ:
Сообщение от RostorLuxor
который будет перехватывать открываемые страницы.
Для этого писать плагин совсем не обязательно. На своем любимом языке можешь написать приложение, которое будет прослушивать какой-нибудь порт, а в настройках браузера в качестве прокси-сервера укажи 127.0.0.1 и прослушиваемый приложением порт.
Вопрос: Генерация однотипные формы.

Есть сайт на котором много форм практически идентичных за исключением названий некоторых пунктов.

Как ниже, только кое где может быть не "Ваше имя", а что то другое.

Вот форм этих 10, может имеет смысл их догружать после загрузки страницы как html или лучше создавать их силами js и уже так обрабатывать?
Или сделать одну форму которая будет меняться в зависимости от вызова.

Что лучше? Что вообще в таких случаях нужно делать? Какой правильный путь?

<div class="pop_up">
            <input type="text"
                   placeholder="Ваше имя"
                   value="Ваше имя"
                   onfocus="if (this.value=='Ваше имя'){this.value=''}"
                   onblur="if (this.value==''){this.value='Ваше имя'}">
            <input type="text" placeholder="E-mail" value="E-mail"
                   onfocus="if (this.value=='E-mail'){this.value=''}"
                   onblur="if (this.value==''){this.value='E-mail'}">
            <input type="text"  placeholder="Телефон" value="Телефон"
                   onfocus="if (this.value=='Телефон'){this.value=''}"
                   onblur="if (this.value==''){this.value='Телефон'}">
            <textarea rows="10" cols="20"
                          onfocus="if (this.value=='Сообщение'){this.value=''}"
                          onblur="if (this.value==''){this.value='Сообщение'}">Сообщение</textarea>
Ответ:
Сообщение от Duda.Ml1986@gmail.com
Что вообще в таких случаях нужно делать?

Иметь шаблон формы и набор значений по условию для placeholder, как объект, в котором имена свойств, это и имя поля формы. Из форм удалить onfocus/onblur, написав обработчик, который будет навешиваться на поля только в том случае, если браузер не поддерживает placeholder.
Вопрос: Форма, которая при вызове с разных кнопок, должна скрывать некоторые поля

Всем доброго времени суток!

У меня есть одна форма, которая при вызове с разных кнопок, должна скрывать некоторые поля.

Вот кнопки:

HTML5
1
2
<a  data-target="#call">Кнопка 1</a>
<a  data-target="#call">Кнопка 2</a>
Вот форма:

HTML5
1
2
3
4
5
6
<div id="call">
<form>
<div class="pole1">Поле 1</div>
<div class="pole2">Поле 2</div>
</form>
</div>
Форма может иметь только один ID, в моем случае это “call”.

Как сделать, чтобы при клике на “Кнопка 1” отображалось только “Поле 1”?
Как сделать, чтобы при клике на “Кнопка 2” отображалось только “Поле 2”?

Сайт делаю для себя. Знаний в js нету.
Ответ: Вот еще решение которое предлогают. Но я его не тестировал.

Вдруг кому понадобится.

<a data-target="#call" onclick="show('id1');">Button 1</a>
<a data-target="#call" onclick="show('id2');">Button 2</a>


<div id="call">
<form>
<div class="pole1" id="id1" style="display:none">Field 1</div>
<div class="pole2" id="id2" style="display:none">Field 2</div>
</form>
</div>


<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>

<script type="text/javascript">
function show(elementId)
{
document.getElementById("id1").style.display="none";
document.getElementById("id2").style.display="none";
document.getElementById(elementId).style.display="block";
}
</script>
Вопрос: Как сделать чтобы плагин создавал возможность добавить страницу, которая использует шаблон из плагина , в меню

Как сделать чтобы плагин создавал возможность добавить страницу, которая использует шаблон из плагина , в меню через админку, как например страница ссылка или пост.
Ответ:

Добавлено через 1 минуту
Вот сюда добавить и чтобы после добавления в меню работала страница по шаблону, который я сделаю. А все это должно добавляться через плагин. Просто никак в wordpress codex найти не могу, а нужно по зарез!

Комментарий администратора TaatshiЗагружайте изображения и файлы на форум и прикрепляйте к сообщению.
Вопрос: Сделать одну кнопку, которая будет выполнять сначала действие первой кнопки, а затем действие второй

Здорова. Есть две кнопки, на которых по нажатию выполняются два скрипта:

Код HTML5
1
2
3
4
5
<input type="image" src="/Images/Icons/add.png" alt="Создать"
    onclick="javascript:__doPostBack('ctl00$MainContent$DetailsView1','New$0');return false;" />
 
<input type="image" src="/Images/Icons/hand_point.png" alt="Выбор"
    onclick="javascript:__doPostBack('ctl00$MainContent$GridView1','Select$0');return false;" />
Цель - сделать одну кнопку, которая будет выполнять сначала действие первой кнопки, а затем действие второй. Но как бы я не пытался, моих "знаний" Javascript не хватило на то, чтобы самому сделать это.

Заранее благодарен.
Ответ:
Код HTML5
1
<input type="image" src="..." alt="..." onclick="javascript:__doPostBack('ctl00$MainContent$DetailsView1','New$0');__doPostBack('ctl00$MainContent$GridView1','Select$0');return false;" />
Если за функцией __doPostBack не кроются какие-либо ajax запросы, то эти строки просто выполнятся последовательно и все должно быть окей.
Вопрос: Изменение стиля строчки таблицы, которая будет по центру вертикали

Итак, есть таблица
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<table style="height:300px; overflow-y:auto;">
 <tr>
  <td>#1</td>
  <td>name1</td>
  <td>desc1</td>
  <td>price1</td>
 </tr>
 <tr>
  <td>#2</td>
  <td>name2</td>
  <td>desc2</td>
  <td>price2</td>
 </tr>
 <tr>
  <td>#3</td>
  <td>name3</td>
  <td>desc3</td>
  <td>price3</td>
 </tr>
 <tr>
  <td>#4</td>
  <td>name4</td>
  <td>desc4</td>
  <td>price4</td>
 </tr>
 <tr>
  <td>#5</td>
  <td>name5</td>
  <td>desc5</td>
  <td>price5</td>
 </tr>
</table>
По вертикальной середине таблицы находится область увеличения с фиксированным положением, при попадании в которую строка должна будет изменить высоту и размер шрифта, и при скролле таблицы, строки в области увеличения соответственно меняются и мне нужно захватывать строку которая будет попадать в эту область.
Ответ: Решил задачу по другому:
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
#popup-table-body {
    background:#f8f8f8;
    border: 1px solid #0000FF;
    height:80vh;
    margin:80px auto;
    max-width:100vw;
    overflow-y:scroll;
    padding:20vh 0px;
    width:500px;
}
#popup-table-body table {
    font-size:9pt;
    margin:50px 0;
    overflow-y:auto;
    width:100%;
}
#popup-table-body tbody {
    text-align:center;
}
#popup-table-body tr {
    display: table;
    table-layout:fixed;
    transition:0.7s;
    width:99%;
}
#popup-table-body table tr td {
    border:1px solid #5c5c5c;
    padding:14px 4px;
    text-align:center;
}
#zoom-area {
    background:#fff;
    border:1px solid grey;
    border-radius:4px;
    font-size:11pt;
    height:160px;
    margin:0px auto;
    max-width:100vw;
    padding:6px 14px;
    position:absolute;
    text-align:left;
    top:35%;
    width:520px;
}
#zoom-area p {
    margin:0px;
}
#zoom-area button {
    float:right;
}
#zoom-area-quant {
    width:50px;
}
.zoom-row {
    background:#fff;
    box-shadow:0px 0px 3px #000;
    height:70px;
    transition: 0.1s;
    width:100% !important;
}
.zoom-row td {
    border:none !important;
    padding:0px;
    text-align:center;
}
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<div id="popup-table-body">
  <div id="zoom-area">
      <p>
        <b>Name: </b>
      </p>
      <p id="zoom-area-price"></p>
  </div>
 <table>
<tbody>
    <tr class="zoom-row">
        <td>Вареники</td>
        <td>400гр</td>
        <td>20 суток</td>
        <td>50 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Булочки</td>
        <td>200гр</td>
        <td>5 суток</td>
        <td>25 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пельмени</td>
        <td>500гр</td>
        <td>30 суток</td>
        <td>100 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Хлеб</td>
        <td>300гр</td>
        <td>3 сутки</td>
        <td>15 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пряники</td>
        <td>250гр</td>
        <td>5 суток</td>
        <td>45 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Булочки</td>
        <td>200гр</td>
        <td>5 суток</td>
        <td>25 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пельмени</td>
        <td>500гр</td>
        <td>30 суток</td>
        <td>100 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Хлеб</td>
        <td>300гр</td>
        <td>3 сутки</td>
        <td>15 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пряники</td>
        <td>250гр</td>
        <td>5 суток</td>
        <td>45 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Булочки</td>
        <td>200гр</td>
        <td>5 суток</td>
        <td>25 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пельмени</td>
        <td>500гр</td>
        <td>30 суток</td>
        <td>100 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Хлеб</td>
        <td>300гр</td>
        <td>3 сутки</td>
        <td>15 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пряники</td>
        <td>250гр</td>
        <td>5 суток</td>
        <td>45 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Булочки</td>
        <td>200гр</td>
        <td>5 суток</td>
        <td>25 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пельмени</td>
        <td>500гр</td>
        <td>30 суток</td>
        <td>100 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Хлеб</td>
        <td>300гр</td>
        <td>3 сутки</td>
        <td>15 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пряники</td>
        <td>250гр</td>
        <td>5 суток</td>
        <td>45 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Булочки</td>
        <td>200гр</td>
        <td>5 суток</td>
        <td>25 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пельмени</td>
        <td>500гр</td>
        <td>30 суток</td>
        <td>100 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Хлеб</td>
        <td>300гр</td>
        <td>3 сутки</td>
        <td>15 сом</td>
        <td>Кыргызстан</td>
    </tr>
    <tr>
        <td>Пряники</td>
        <td>250гр</td>
        <td>5 суток</td>
        <td>45 сом</td>
        <td>Кыргызстан</td>
    </tr>
</tbody>
</table>
</div>
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
$(document).ready(function(){
 
    var element = document.querySelector('#popup-table-body');
    var gettr = $('tr');
    var index = 0;
    $(gettr[index]).addClass("zoom-row");
 
    element.onscroll = function() {
        var maxScoll = 1 + element.scrollHeight - element.clientHeight;
        var scroll = element.scrollTop;
 
        $('#zoom-area').empty();
        $(gettr[index]).removeClass("zoom-row");
 
        index = gettr.length * (scroll/maxScoll)|0;
 
        $(gettr[index]).addClass("zoom-row");
        $('#zoom-area').append('<input id="zoom-row-price" type="hidden">');
 
        $('.zoom-row td').each(function() {
            var colthis = $(this);
            var colval = $(this).text();
            var colind = $(colthis).index();
            var colname = $('#popup-table-body');
            if(colind !== 3) {
            if(colind == 0) {
                $('#zoom-area').append('<p id="zoom-area-name"><b> ' + colval + ' </b></p><hr>');
            }
            else {
                $('#zoom-area').append(' <b> ' + colval + '</b>;');
            }
            }
            if(colind == 3) {
                $('#zoom-row-price').val(colval);
            }
        });
 
        var colprice = $('#zoom-row-price').val();
        $('#zoom-area').append('<hr>');
        $('#zoom-area').append('<h5>Заказ</h5>');
        $('#zoom-area').append('<p id="zoom-area-price"><b>Цена: </b> <span>' + colprice + '</span>');
        $('#zoom-area').append('Кол-во: <input id="zoom-area-quant" type="number" required>');
        $('#zoom-area').append('<button id="btnaddtocart" class="btn btn-sm btn-warning">в корзину</button></p>');
    }
 
 
    $(document).on('click','#btnaddtocart',function() {
        $('#tocartinfo').toggle();
        var tocartname = $('#zoom-area-name b').text();
        var tocartquant = $('#zoom-area-quant').val();
        var tocartprice = $('#zoom-row-price').val();
        // var tocartsumm = tocartquant * tocartprice;
        $('#tocartname span').text(tocartname);
        $('#tocartquant span').text(tocartquant);
        $('#tocartprice span').text(tocartprice);
        // $('#tocartsumm span').text(tocartsumm);
    });
 
 
    $('#btn-showcart').click(function() {
        $('#tocartinfo').toggle();
        $('#pricelist-cart').toggle();
 
        var tocartname = $('#zoom-area-name b').text();
        var tocartquant = $('#zoom-area-quant').val();
        var tocartprice = $('#zoom-row-price').val();
 
        $('#pricelist-cart table').append('<tr><td>'+tocartname+'</td><td>'+tocartquant+'ед</td><td>'+tocartprice+'</td></tr>');
 
    });
 
    $('#btn-tocarthide').click(function() {
        $('#tocartinfo').toggle();
    })
 
 
        $(document).mouseup(function(e) { // событие клика по веб-документу
            var div = $("#pricelist-cart"); // тут указываем ID элемента
            if (!div.is(e.target) // если клик был не по нашему блоку
                &&
                div.has(e.target).length === 0) { // и не по его дочерним элементам
                div.hide(); // скрываем его
            }
        });
 
});
Вопрос: Создание страници НТМЛ в которой будет таблица, рамка

Объясните как сделать такую страницу


HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
ХАИ был основан в 1930 г. Его история тесно связана с развитием
авиационной промышленности и науки. Университет известен созданием
первого в Европе скоростного самолета с убирающимся шасси и проекта 
турбореактивного двигателя, автором которого был преподаватель ХАИ А. М. 
Люлька, впоследствии академик и создатель многих конструкций 
авиационных двигателей, в том числе и двигателя самолета Су-27. ХАИ - 
единственный вуз, чьи самолеты, разработанные в институтском 
конструкторском бюро под руководством профессора И. Г. Немана, серийно 
выпускались на авиазаводах и эксплуатировались на пассажирских линиях. В 
1978 г. ХАИ было присвоено имя теоретика авиации Н.Е. Жуковского. В 1980 г. 
институт был награжден высшей наградой СССР - орденом Ленина. В 1998 г. 
на базе ХАИ был организован Государственный аэрокосмический университет 
им. Н.Е. Жуковского "Харьковский авиационный институт", а в 2000 г.</div></td></tr>
<tr height="60px"><td></td>
<td colspan="6" background="slogan.jpg">
<div class="text1">университет получил статус Национального вуза и новое название: 
Национальный аэрокосмический университет им. Н.Е. Жуковского 
"Харьковский авиационный институт". За годы своего существования 
университет подготовил около 60 тысяч инженеров. Более 80% специалистов 
с высшим образованием, работающих в авиакосмической отрасли Украины, - 
выпускники ХАИ.</div>


Справа должно быть меню! в левом верхнем углу должно быть фото.+ это все должно быть в рамке .
 Комментарий модератора whiteapps
Обсуждение вопросов - только в теме на форуме. Приглашения к обсуждению еще где-либо (в том числе и с помощью системы личных сообщений) запрещены, за исключением коммерческих разделов.
Ответ: Это вообще что? Хоть бы картинку показал как это должно быть