Аукцион ebay на русском. Листинг, прокрутка изображений

[catty888]

Хочу добавить русский в листинги. Вопрос - как он будет отображаться у других, Аукцион ebay на русском?
Делаю листинги в FrontPage, в коде вижу, что кириллица пишится в цифрах, тогда как европейские языки - на латинице.
В FIrefox проверила - вроде читается.

И еще, может кто-нибудь поделится кодом, как сделать прокрутку изображений как в этом листинге

Загрузка...

cgi.ebay.com

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

 

[qwdfsfdfgfg]

И еще, может кто-нибудь поделится кодом, как сделать прокрутку изображений как в этом листинге

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

 

[kay27]

eBay использует кодировку UTF-8, так что если у вас отображается - у других отобразится тоже. главное - убедитесь, что кодировка именно UTF-8.
FrontPage - хороший инструмент, но только для начинающих. Скачайте учебник по HTML.
Как делать прокрутку... не воспринимайте только как издёвку, но вот вам готовый, проверенный и рабочий кусок HTML-кода, можете даже попытаться использовать его во FrontPage, ключевое здесь - отлов события, когда мышь находится над эскизом (превью) - onmouseover, и динамическая замена фотографии с помощью свойства innerHTML:

[cut]PGltZyBzcmM9J9C/0YDQtdCy0YzRjiAxJyBvbm1vdXNlb3Zlcj0nZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoInBob3RvIikuaW5uZXJIVE1MPSI8aW1nIHNyYz0i0KTQvtGC0L7Qs9GA0LDRhNC40Y8gMSI+[/cut]"'> [cut]PGltZyBzcmM9J9C/0YDQtdCy0YzRjiAyJyBvbm1vdXNlb3Zlcj0nZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoInBob3RvIikuaW5uZXJIVE1MPSI8aW1nIHNyYz0i0KTQvtGC0L7Qs9GA0LDRhNC40Y8gMiI+[/cut]"'> ... [cut]PGltZyBzcmM9J9C/0YDQtdCy0YzRjiBOJyBvbm1vdXNlb3Zlcj0nZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoInBob3RvIikuaW5uZXJIVE1MPSI8aW1nIHNyYz0i0KTQvtGC0L7Qs9GA0LDRhNC40Y8gTiI+[/cut]"'> <hr> <div id=photo name=photo><img src="Фотография 1">"

 

[catty888]

Спасибо большое за ответы!

использовать kuozou

А что это такое?

FrontPage - хороший инструмент, но только для начинающих. Скачайте учебник по HTML.

Front Page здесь уже пинали программисты со стажем :cry:
Меня пока на этом уровне устраивает, все равно ищу веб дизайнера для создания сайта, которого попрошу причесать и ибеевскую страницу. Изучать и вникать досконально в HTML не хочу, так как каждый должен заниматься своим делом :evil:
Не знаю, насколько затянется поиск, поэтому хотела чуть-чуть попробовать улучшить листинг пока.

Спасибо большущее за код! Почему я должна воспринимать его как издевку?

:(

Единственное,

'превью 1'

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

 

[qwdfsfdfgfg]

kuozou

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

 

[kay27]

catty888
Вместо "превью ..." и "Фотография ..." надо подставить ссылки на изображения. Превью - уменьшенное. Фотография - основное.
Размер можете добавить. Специально не стал ничего писать в коде про размер, чтобы получилось нагляднее и проще.
В тэги <img> можно подставить параметры width=X и height=Y, где X и Y - размеры в пикселах. Но если правильно подготовлены изображения (имеют должный размер) - то размер необязательный параметр.
Про издёвку - ну, как бы, неловко мне отсылать вас к азам. Но HTML - это, в общем, простой язык разметки. Один раз факультативно вы можете прочитать на досуге книжку, то, что вам пригодится для оформления - запомните, лишнее пропустите. Ничего в нём особо сложного нет. Искренняя рекомендация. Вы же не сайт пишете, а всего лишь часть странички с товаром.
Ну и до кучи, вот так можно написать, чтобы протестировать код без создания превьюшек, в качестве превью будут использоваться основные изображения, а уже браузер сам будет уменьшать их до размера 160x120 (но обычно не рекомендуется возлагать масштабирование на браузер, так что это просто для того, чтобы вы увидели сразу же результат):

[cut]PGltZyBzcmM9J9Ck0L7RgtC+0LPRgNCw0YTQuNGPIDEnIHdpZHRoPTE2MCBoZWlnaHQ9MTIwIG9ubW91c2VvdmVyPSdkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgicGhvdG8iKS5pbm5lckhUTUw9IjxpbWcgc3JjPSLQpNC+0YLQvtCz0YDQsNGE0LjRjyAxIj4=[/cut]"'> [cut]PGltZyBzcmM9J9Ck0L7RgtC+0LPRgNCw0YTQuNGPIDInIHdpZHRoLTE2MCBoZWlnaHQ9MTIwIG9ubW91c2VvdmVyPSdkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgicGhvdG8iKS5pbm5lckhUTUw9IjxpbWcgc3JjPSLQpNC+0YLQvtCz0YDQsNGE0LjRjyAyIj4=[/cut]"'> <hr> <div id=photo name=photo><img src="Фотография 1">"

 

[catty888]

Попробовала использовать код - картинки не реагируют на мышку. Получаются залиты три картинки: одна большая центральная и две маленьких.
Видимо, код не работает в FrontPage

 

[kay27]

В FrontPage такие штуки делают.
Думаю, всё у вас в итоге должно получиться, но придётся поэкспериментировать какое-то время.
Проверьте, что основная картинка заключена в объект DIV, у которого должно быть определено два параметра: id и name. В моём примере это "photo".
Проверьте, что у дополнительных картинок есть параметр "onmouseover", в котором выполняется подмена основной картинки - как в примере выше.
На скорую руку набросал несколько "живых" примеров с HTML-кодом, загляните.
Чтобы я мог помочь непосредственно с FrontPage, вам придётся либо сюда выложить созданный там HTML-код (только предварительно обязательно отключите в сообщении форума HTML-код), либо залить куда-то страницу и дать здесь на неё ссылку.

 

[catty888]

Сейчас получается, на мышку реагируют .
Только сейчас появилось другая проблема - основная картинка смещается вбок, когда я нажимаю на превьюшки.
Я хотела бы разместить галлерею превью внизу большой картинки, находящейся по центру. Мне кажется, что div /div задает формат "слева".

Или, если я правильно поняла, нужно нарисовать таблицу невидимую (разметка страницы), в нее вписать картинки и отцентровать относительно ячейки таблицы.
Таблицу я знаю, как делать, у меня текст на трех языках распихан по ячейкам

 

[kay27]

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

в примерах div встречается дважды: в самом первом, где ещё нет таблицы. именно у блока div меняется содержимое. он нужен, чтобы мы могли менять только то, что внутри него. и в третьем - именно элемент div отображается с полосой прокрутки. начиная со второго примера тот, первый div исчезает - он становится не нужен, так как уже есть объект, содержимое которого мы можем полностью заменить - это ячейка таблицы, td.

ну, это всё теория. смотрите четвёртый вариант. единственный недостаток - та самая полоса прокрутки. она может отличаться в разных браузерах, темах оформления рабочего стола и операционных системах. сейчас на неё выделяется примерно 28 пикселей. должно, вроде бы, хватать. у меня над ней остаётся не очень приятная белая полоса, которую желательно оставить.

 

[catty888]

Скопировала код, поменяла фото, убрала прокрутку. Мышкой трогаю картинки - переключаются.

Только у меня изображение не центрируется. Всегда лепится к левой части. Ячейку я по центру выровняла, а картинка в ней сдвинута. Галерея при просмотре тоже смещается влево в ячейке.
У Вас в примере - картинка пристрочена к левому краю. Я пытаюсь найти код для того, чтобы ее сдвинуть, но пока не нашла.

Также, когда мышку подвожу к картинке, несмотря на заданные размеры, картинка расползается на всю страницу. Ячейка вроде не должна позволять этого делать.

Завтра с новым мозгом попробую еще раз. Я же говорю, что все должны делать профессионалы. Сколько уже времени убито на эту несчастную галлерею! :cry:

 

[kay27]

Размер-то какой у картинок? Их прежде чем выкладывать, надо масштабировать. Уменьшить, то есть. Например, это можно сделать с помощью бесплатной программы XNView (которая, правда, говорят, ворует идеи из InfanView, но им я не пользовался, так что точно не знаю). Это ещё называется подготовкой к публикации. Невежливо по отношению к пользователю выкладывать в интернет огромные фотографии, которые при просмотре будут уменьшены до 400x300, к примеру.

Где будет расположена галерея - зависит от свойств объекта, в котором она расположена. Проще всего код поместить между тегами <center> </center>, и результат будет в центре.

См. вариант 5.

А вообще непонятно, какой смысл в Аукцион ebay на русском.

 

[lyudmilab2000]

Подскажите, возможно ли делать такую прокрутку, если фото находятся за внешнем хостинге? Как тогда вставлять адрес картинки? Просто копируется ссылка на рессурс ( там где идет имя картинки)? Или как-то по-другому?

 

[kay27]

Извините, что сразу не ответил - в отпуске был
Все фотографии обычно как раз и находятся на внешнем хостинге.

 

[marcoua]

kay27, попробовал сделать как Вы в пятом варианте.. картинки подгружаются, но не переключаются.
Я поискал подобные галерейки на ebay и нашел такую. Вставил в листинг.. тот же эффект ((((
У меня есть предположение, что onmouseover работает только в Stor-ах. Или я не прав?

 

[kay27]

У меня есть предположение, что onmouseover работает только в Stor-ах. Или я не прав?

К своему стыду, так и не понял, что значит "в Stor-ах"
Чем вы редактируете листинг? Каким-то специализированным редактором HTML?
onmouseover работает везде, где есть HTML4 и джаваскрипт.

 

[marcoua]

К своему стыду, так и не понял, что значит "в Stor-ах"

Store - это магазин на Ebay. Подробнее

Чем вы редактируете листинг?

Листинг редактирую через веб-интерфейс Ebay.

 

[marcoua]

Эврика! Все получилось!! ))
Изначально, я просто вставил в листинг код из пятого варианта.
Все получилось когда вставил код в Дримвьюер, а уже потом в листинг.

 

[kay27]

Странно... потмоу что никакой дримвьюер тут точно не нужен Рад, что у вас всё получилось в итоге. А если захочется разобраться в причине, то мне надо для этого увидеть и сравнить оригинальный код и код, пропущенный через дримвьюер.