Слайдер съезжает в разных браузерах

@stecloduv · Регистрация: 18.11.2015

Студворк — интернет-сервис помощи студентам

стоял флеш, делал в Macromedia Dreamweaver 8. работал прекрасно , но в телефонах и планшетах не видимый, поставил слайдер вот исходник http://ruseller.com/lessons.php?rub=2&id=1475, в хроме работает нормально, в IE слайдер сдвинут в право и не работает, думаю что в других браузерах тоже проблемы, вот мой сайт со слайдером. минипакдв.рф на фото как сайт выглядит в хроме и IE.
Сразу прошу прощения я лузер поэтому на языке супер программистов, сленге, прошу не объяснять лучше пальцем покажите, шутка. Других браузеров у меня нет если проверите на других и покажите как работает буду очень благодарен. Заранее спасибо

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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
<!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>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css"/>
<script type="text/javascript" src="fancybox/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.2.1.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() { 
$("a.first").fancybox(); 
$("a.two").fancybox(); 
$("a.video").fancybox({"frameWidth":560,"frameHeight":340}); 
$("a.content").fancybox({"frameWidth":600,"frameHeight":300}); 
});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251"/>
<meta name="keywords" content=" порционные продукты купить"/>
<meta name="description" content="Производство продуктов питания для фаст фуда .Борт питание (аэропорт , ж\д). Порционные продукты, мелкая фасовка. Хорека."/>
<title>Порционные продукты, мелкая фасовка, хорека.</title>
<link href="css/styles.css" rel="stylesheet" type="text/css"/>
<style type="text/css">
<!--
body {
    margin-left: 0px;
}
.style12 {  font-size: 14px;
    font-weight: bold;
    font-style: italic;
}
.style16 {font-size: 14px; font-weight: bold; }
.style5 {   font-family: "Comic Sans MS";
    font-size: 28px;
}
.style9 {   font-family: Arial, Helvetica, sans-serif;
    font-size: 28px;
    color: #FF0000;
    font-weight: bold;
}
.style31 {
    color: #FF0000;
    font-size: 30px;
}
.style41 {
    font-size: 12px;
    color: #003333;
}
.style40 {
    color: #003333;
    font-weight: bold;
}
.style42 {color: #003333; font-weight: bold; font-family: Arial, Helvetica, sans-serif; }
-->
</style></head>
<body>
<center>
  <div id="main">
    <div style="background:url(images/corner-topmid.gif); background-repeat:repeat-x; height:24px; width: 808px;"></div>
    <div id="container">
      <div id="header"><img src="images/graphic-left.GIF" alt="порционные продукты, мелкая фасовка, хорека, хабаровск" width="234" height="264" /><img src="images/graphic-right.GIF" alt="порционные продукты, мелкая фасовка, хорека, хабаровск" width="439" height="264" /></div>
      <div></div>
    </div>
    <p><img src="images/corner-midtop.gif" alt="1" width="786" height="28" /></p>
    <div id="container1">
<ul class="vert_menu">
    <li><a href="porsion.html"><span>СОУСЫ</span></a></li>
    <li><a href="spezii.html"><span>СПЕЦИИ</span></a></li>
    <li><a href="horeka.html"><span>ХОРЕКА</span></a></li>
    <li><a href="partneri.html"><span>ПАРТНЕРЫ</span></a></li>
    <li><a href="prise.html"><span>ПРАЙС</span></a></li>
    <li><a href="kontakt.html"><span>КОНТАКТЫ</span></a></li>
    <li><a href="spros.html"><span>СКОРО</span></a></li>
  </ul>
</div>
    <div class="slides">
      <ul>
        <li><a href="porsion.html"><img src="images/pic1.jpg" alt="порционные продукты, мелкая фасовка, хорека, хабаровск" border="0" /></a>
            <div>Порционные продуты</div>
        </li>
        <li><a href="horeka.html"><img src="images/pic2.jpg" alt="порционные продукты, мелкая фасовка, хорека, хабаровск" border="0" /></a>
            <div>Снабжение ресторанов</div>
        </li>
        <li><a href="porsion.html"><img src="images/pic3.jpg" alt="порционные продукты, мелкая фасовка, хорека, хабаровск" border="0" /></a>
            <div>Новый продукт</div>
        </li>
        <li><a href="spezii.html"><img src="images/pic4.jpg" alt="порционные продукты, мелкая фасовка, хорека, хабаровск" border="0" /></a>
            <div>Порционные специи</div>
        </li>
      </ul>
    </div>
 
 
[CSS]body{background-color:#e1e9ca;background-image:url(../images/bg.gif);background-repeat:repeat-x; background-attachment: fixed;background-position: bottom;}
#main{
    margin-top:24px;
    overflow:hidden;
    background:url(../images/bg-mid.gif);
    background-repeat:repeat-y;
    margin-bottom:50px;
    width: 808px;
}
#container{
    width:750px;
    overflow:hidden;
    height: 264px;
}
#container1{
    float:left;    
    width:230px;
    overflow:hidden;
    height: 330px;
}
#container3{
    width:220px;
    overflow:hidden;
    height: 750px;
    float: left;
}
#container4{
    width:560px;
    overflow:hidden;
    height: 500px;
}
 
ul {
    list-style: none;
        margin: 0;
        padding: 0;
}
 
 
.vert_menu {
    font-weight: bold;
    font-family: Verdana, Helvetica, sans-serif;
    text-decoration: none;
    font-size: 99%;
    width: 212px;   
}
 
.vert_menu li {
    height: 45px;
}
 
.vert_menu li a:link, .vert_menu li a:visited {
        text-decoration: none;  
        color: #FFFFFF;
        display: block;
        background:  url(../images/vert_menu.png) 0 0 no-repeat;
        padding: 10px 0 10px 10px;
}
 
.vert_menu li a:hover, .vert_menu li #current {
    color: #FFF;
    background: url(../images/vert_menu.png) 0 -44px no-repeat;
    padding: 10px 0 10px 15px;
}
.slides {
    width: 570px;
    height: 332px;
}
 
/* Кадры анимации #anim_slides */
@-webkit-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}
@-moz-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}
 
.slides ul li {
    opacity:0;
    top:390px;
 
    -webkit-animation-name: anim_slides;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
 
    -moz-animation-name: anim_slides;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
    left: 442px;
    position: absolute;
    width: 558px;
    height: 321px;
}
 
/* Задержки css3 */
.slides ul  li:nth-child(2), .slides ul  li:nth-child(2) div {
    -webkit-animation-delay: 6.0s;
    -moz-animation-delay: 6.0s;
}
.slides ul  li:nth-child(3), .slides ul  li:nth-child(3) div {
    -webkit-animation-delay: 12.0s;
    -moz-animation-delay: 12.0s;
}
.slides ul  li:nth-child(4), .slides ul  li:nth-child(4) div {
    -webkit-animation-delay: 18.0s;
    -moz-animation-delay: 18.0s;
}
 
/* Кадры анимации #anim_titles */
@-webkit-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}
@-moz-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}
 
.slides ul li div {
    background-color:#000000;
    border-radius:10px 10px 10px 10px;
    box-shadow:0 0 5px #FFFFFF inset;
    color:#FFFFFF;
    font-size:20px;
    left:6px;
    margin:0 auto;
    padding:20px;
    position:absolute;
    top:194px;
    width:200px;
 
    /* Анимация css3 */
    -webkit-animation-name: anim_titles;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
 
    -moz-animation-name: anim_titles;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}
[/CSS]

@mrBobrillo · 18.11.2015, 23:18

Смотрел в фоксе, все печально, да и верстка печальная на самом деле.
Советую вам скачать и поставить bxslider, погуглите, сразу же наткнетесь на сайт.

Классу #container1 присвоен float: left; а слайдеру совсем ничего не присвоено, поставьте float: right; + так как вашим li стоит position: absolute, то все будет не гуд, классу .slides следует поставить position: relative; но это тоже не совсем будет гуд, так как все поплывет.

Вывод, чтоб долго не мучаться, поставьте слайдер который я выше привел в пример.

Добавлено через 5 минут
В хроме и эксплорере тоже все печально

Добавлено через 4 минуты
Смотрите что можно сделать:

CSS
1
2
3
4
5
6
.slides {
    width: 570px;
    height: 332px;
    position: relative;
    float: right;
}

Для .slides ul li ставим top: 0; left: 0;

В фоксе все более адекватно, в остальных не знаю, пробуйте

@Almag13 · 19.11.2015, 00:16

Можете к bxslider установить callback и выполнить анимацию такого же типа как в примере
Про опции можете почитать тут
Прокрутить до названия Callback
Есть после до, после клика перед кликом, после загрузки

@stecloduv · 19.11.2015, 12:19 **[ТС]**

спасибо за совет, начал ставить bxslider, конфликтует с меню или с увеличением картинок при клике, не понял пока, поэтому снес все оставил пустую страницу и поставил bxslider, пока все отлично, один вопрос работаю Dreamweaver 8 , в слайдере 4 фотки они в Dreamweaver 8 стоят одна за одной вниз сдвигая нижнию часть сайта, можно что нибудь сделать, когда флеш был видно было одну фотку,

@mrBobrillo · 19.11.2015, 12:26

Установите и верстайте в более адекватном текстовом редакторе, не используйте Dreamweaver!
По поводу конфликта, внимательно пересмотрите скрипты, что то где то пересекается и мешает друг другу работать ...

@stecloduv · 19.11.2015, 18:28 **[ТС]**

про конфлик я уже понял, других редакторов пока не знаю, как подсадили , может кто подскажет как спрятать фотки чтоб одна была

Добавлено через 5 часов 44 минуты
всем супер супер гуд, поставил bxslider, все работает хорошо,

@stecloduv · 19.11.2015, 18:34 **[ТС]**

теперь новая проблема помогите разобраться, после установки нового слайдера, открытие большой фотки по клику сбилось, вот две фотки как было и как сейчас . По моему где то здесь

@mrBobrillo · 19.11.2015, 18:36

Вам нужно подключить плагин для модального окна, в данный момент у вас фото просто открывается в новом окне.

@stecloduv · 19.11.2015, 18:38 **[ТС]**

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
<!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>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css"/>
<script type="text/javascript" src="fancybox/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.2.1.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() { 
$("a.first").fancybox(); 
$("a.two").fancybox(); 
$("a.video").fancybox({"frameWidth":560,"frameHeight":340}); 
$("a.content").fancybox({"frameWidth":600,"frameHeight":300}); 
});
</script>
<!-- bxSlider CSS file -->
<link href="css/jquery.bxslider.css" rel="stylesheet" />
<!-- jQuery library (served from Google) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="js/jquery.bxslider.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $('.bxslider').bxSlider({
  captions: true,
  auto: true,
  mode: 'fade'
  }); 
});
</script>

Добавлено через 46 секунд
да у меня все работало пока не переделал слайдер

Добавлено через 52 секунды
все работало пока не поставил слайдер новый не могу понять в чем конфликт

@mrBobrillo · 19.11.2015, 18:39

HTML5
1
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

Он должен быть над всеми линками, которые ведут к js файлам
А у вас там куча мала ...

@stecloduv · 19.11.2015, 18:46 **[ТС]**

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
<!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>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css"/>
<script type="text/javascript" src="fancybox/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.2.1.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() { 
$("a.first").fancybox(); 
$("a.two").fancybox(); 
$("a.video").fancybox({"frameWidth":560,"frameHeight":340}); 
$("a.content").fancybox({"frameWidth":600,"frameHeight":300}); 
});
</script>
<!-- jQuery library (served from Google) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="js/jquery.bxslider.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $('.bxslider').bxSlider({
  captions: true,
  auto: true,
  mode: 'fade'
  }); 
});
</script>
<!-- bxSlider CSS file -->
<link href="css/jquery.bxslider.css" rel="stylesheet" />

было вот так, это я уже сам пытался разобраться

Добавлено через 1 минуту
поставил над всеми линками пропал слайдер

@mrBobrillo · 19.11.2015, 18:49

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
<!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>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css"/>
<!-- jQuery library (served from Google) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script type="text/javascript" src="fancybox/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.2.1.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() { 
$("a.first").fancybox(); 
$("a.two").fancybox(); 
$("a.video").fancybox({"frameWidth":560,"frameHeight":340}); 
$("a.content").fancybox({"frameWidth":600,"frameHeight":300}); 
});
</script>
<script src="js/jquery.bxslider.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $('.bxslider').bxSlider({
  captions: true,
  auto: true,
  mode: 'fade'
  }); 
});
</script>
<!-- bxSlider CSS file -->
<link href="css/jquery.bxslider.css" rel="stylesheet" />

@stecloduv · 19.11.2015, 18:57 **[ТС]**

пропал слайдер

@mrBobrillo · 19.11.2015, 19:04

Скиньте файлы с версткой, так с ходу не скажешь в чем проблема ...

@stecloduv · 19.11.2015, 19:08 **[ТС]**

сайт на сервере подойдет

Добавлено через 1 минуту
куда скинуть и какие файлы

@mrBobrillo · 19.11.2015, 19:11

На сервере не подойдет, я ведь не смогу там ничего поправить. Скинуть можно или на дропбокс, потом дать ссылку или на гуглдиск

@stecloduv · 19.11.2015, 19:43 **[ТС]**

прости не много не понял, я же предупреждал я что немного лузер,
,

Добавлено через 6 минут
дропбокс, гуглдиск я не знаю как это сделать

Добавлено через 7 минут
может архивом на почту 37 мегобайт

Добавлено через 12 минут
ну вот разобрался с дропбоксом вот ссылка https://www.dropbox.com/s/bu6y... 9.zip?dl=0

@mrBobrillo · 19.11.2015, 22:14

Полноценно не удается устранить конфликт, следовательно предлагаю сменить fancybox на colorbox, у себя подключил, проверил, ничего не конфликтует.
https://plugins.jquery.com/colorbox/

@stecloduv · 20.11.2015, 09:47 **[ТС]**

как это сделать

Добавлено через 5 часов 52 минуты
это не может быть причиной конфликта (валидатор)

Error Line 17, Column 78: required attribute "type" not specified
…src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
✉
The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element.

Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>.

Error Line 19, Column 40: required attribute "type" not specified
<script src="js/jquery.bxslider.min.js"></script>
✉
The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element.

Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>.

@mrBobrillo · 20.11.2015, 10:03

Все возможно, но никакие перестановки подключений скриптов не помогали, так что я скачал другой плагин и все стало прекрасно работать.
Качаете данный плагин по ссылке что я дал, кнопка скачать в правой колонке. Убираете подключения старого плагина, делаете подключения js, css нового плагина, ставите класс на ссылку и воаля, все должно работать

Новые блоги и статьи Все статьи Все блоги /
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .

@Almag13 27 / 28 / 16 Регистрация: 18.10.2015 Сообщений: 187
	19.11.2015, 00:16
	Можете к bxslider установить callback и выполнить анимацию такого же типа как в примере Про опции можете почитать тут Прокрутить до названия Callback Есть после до, после клика перед кликом, после загрузки 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	19.11.2015, 12:19 [ТС]
	спасибо за совет, начал ставить bxslider, конфликтует с меню или с увеличением картинок при клике, не понял пока, поэтому снес все оставил пустую страницу и поставил bxslider, пока все отлично, один вопрос работаю Dreamweaver 8 , в слайдере 4 фотки они в Dreamweaver 8 стоят одна за одной вниз сдвигая нижнию часть сайта, можно что нибудь сделать, когда флеш был видно было одну фотку, 0

@mrBobrillo 49 / 42 / 25 Регистрация: 18.11.2015 Сообщений: 279
	19.11.2015, 12:26
	Установите и верстайте в более адекватном текстовом редакторе, не используйте Dreamweaver! По поводу конфликта, внимательно пересмотрите скрипты, что то где то пересекается и мешает друг другу работать ... 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	19.11.2015, 18:28 [ТС]
	про конфлик я уже понял, других редакторов пока не знаю, как подсадили , может кто подскажет как спрятать фотки чтоб одна была Добавлено через 5 часов 44 минуты всем супер супер гуд, поставил bxslider, все работает хорошо, Миниатюры 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	19.11.2015, 18:34 [ТС]
	теперь новая проблема помогите разобраться, после установки нового слайдера, открытие большой фотки по клику сбилось, вот две фотки как было и как сейчас . По моему где то здесь Миниатюры 0

@mrBobrillo 49 / 42 / 25 Регистрация: 18.11.2015 Сообщений: 279
	19.11.2015, 18:36
	Вам нужно подключить плагин для модального окна, в данный момент у вас фото просто открывается в новом окне. 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	19.11.2015, 18:57 [ТС]
	пропал слайдер Миниатюры 0

@mrBobrillo 49 / 42 / 25 Регистрация: 18.11.2015 Сообщений: 279
	19.11.2015, 19:04
	Скиньте файлы с версткой, так с ходу не скажешь в чем проблема ... 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	19.11.2015, 19:08 [ТС]
	сайт на сервере подойдет Добавлено через 1 минуту куда скинуть и какие файлы 0

@mrBobrillo 49 / 42 / 25 Регистрация: 18.11.2015 Сообщений: 279
	19.11.2015, 19:11
	Сообщение было отмечено stecloduv как решение Решение На сервере не подойдет, я ведь не смогу там ничего поправить. Скинуть можно или на дропбокс, потом дать ссылку или на гуглдиск 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	19.11.2015, 19:43 [ТС]
	прости не много не понял, я же предупреждал я что немного лузер, , Добавлено через 6 минут дропбокс, гуглдиск я не знаю как это сделать Добавлено через 7 минут может архивом на почту 37 мегобайт Добавлено через 12 минут ну вот разобрался с дропбоксом вот ссылка https://www.dropbox.com/s/bu6y... 9.zip?dl=0 0

@mrBobrillo 49 / 42 / 25 Регистрация: 18.11.2015 Сообщений: 279
	19.11.2015, 22:14
	Полноценно не удается устранить конфликт, следовательно предлагаю сменить fancybox на colorbox, у себя подключил, проверил, ничего не конфликтует. https://plugins.jquery.com/colorbox/ 0

@stecloduv 0 / 0 / 0 Регистрация: 18.11.2015 Сообщений: 52
	20.11.2015, 09:47 [ТС]
	как это сделать Добавлено через 5 часов 52 минуты это не может быть причиной конфликта (валидатор) Error Line 17, Column 78: required attribute "type" not specified …src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> ✉ The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element. Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>. Error Line 19, Column 40: required attribute "type" not specified <script src="js/jquery.bxslider.min.js"></script> ✉ The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element. Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>. 0

@mrBobrillo 49 / 42 / 25 Регистрация: 18.11.2015 Сообщений: 279
	20.11.2015, 10:03
	Все возможно, но никакие перестановки подключений скриптов не помогали, так что я скачал другой плагин и все стало прекрасно работать. Качаете данный плагин по ссылке что я дал, кнопка скачать в правой колонке. Убираете подключения старого плагина, делаете подключения js, css нового плагина, ставите класс на ссылку и воаля, все должно работать 0

Слайдер съезжает в разных браузерах

Решение