Консультации Портала - Консультация #185521

Задать вопрос Консультации Пользователи Форум

Задать вопрос экспертам

Консультация № 185521

27.02.2012, 23:34

81.80 руб.

0 21 1

Компьютеры Программирование

Здравствуйте, уважаемые эксперты! Прошу вас ответить на следующий вопрос: Начну с того что я пишу электронный учебник (файл справки, тобишь .chm) при этом конечно прописываю все в блокноте и сохраняю в .htm потом уже компилирую в *.chm (для компиляции использовал программу HTML Help Workshop)
А вопрос заключается в следующем. мне необходимо сделать оформление... одинаковое на каждой странице учебника. Кое что у меня получилось и выглядит вот так: http://s53.radikal.ru/i141/1202/36/8198f8018dc6.jpg
но после того как я переконвертирую в файл-справки то почему то получается вот так: http://s018.radikal.ru/i528/1202/80/00ee65d311b1.jpg
Смысл в том что мне необходимо добавить к каждой странице вот эти облака сверху и траву снизу.
не понимаю почему после компиляции пропадает оформление. Честно признаться код этих пейзажей не мой, я брал с источника mir.ufanet.ru (можете глянуть для наглядного примера)
в приложении я написал ту часть используемого года, которая как раз описывает оформление пейзажа! (CSS и сам файл .htm)
возможно дело в использовании div ..как мне сказали файл .chm не воспринимает эту переменную.
на всякий случай дам ссылку на файлы которые могут понадобится, чтобы разобраться в коде: http://rapid.ufanet.ru/3479758 (архив)
Помогите уважаемые эксперты написать правильно оформление. не важно каким способом это будет написано. главное чтобы облака были наверху а трава внизу. и при изменении масштаба оставались в своем же положении, т.е. ни вверх ни вниз не съезжали. как для примера можно глянуть mir.ufanet.ru.
-------
И один простой вопрос не по теме: как сделать так чтобы анимация на странице повторялась вновь и вновь? использую стандартный метод: <img src=roads.gif height=500 width=800 > но как зациклить не знаю.

Благодарю вас заранее за оказанную помощь. Надеюсь Вам все будет понятно все что я тут понаписал ))

Приложение:
CSS:

body {
width: 100%;
color: #000;
background: #fff url(grass000.jpg) repeat-x bottom;
font: 11pt Verdana, sans-serif;
}

hr.top {height: 257px; min-width: 850px; background: url(bg_top00.jpg) no-repeat center top;}
div#ball {
position: absolute; z-index: 5;
width: 446px; height: 315px;
top: 0; left: 0;
background: url(header_l.png) no-repeat top left;
}
a#ufanet-ball {position: absolute; display: block; top: 0; left: 0; width: 200px; height: 200px; z-index: 10;}
div#clouds {
position: absolute; z-index: 3;
width: 518px; height: 255px;
top: 0; right: 0;
background: url(header_r.png) no-repeat top right;
}

-----------------------------------------------------------------------------

*.htm

<body>
<div id="top">

<div id="ball" class="fix"></div>

</HEAD>

Обсуждение

Неизвестный

28.02.2012, 00:01

общий

Добрый вечер,

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

1. файл grass000.jpg не встроился в CHM файл, поэтому его нет. Если есть возможность, откройте CHM архив с помощью какого-нибудь 7zip архиватора, или плагина Тотал Коммандера: http://www.totalcmd.net/plugring/chmdir.html

2. Если этот файл есть, проверьте, не изменился ли его путь после сборки хелпа.
Просто ваша трудность могла возникнуть по вине причин, которые я нашел в вебе:
http://stackoverflow.com/questions/5039338/chm-vs-cssbackground
http://lists.oasis-open.org/archives/docbook-apps/200909/msg00081.htm

чтобы GIF файл крутился вечно, вам надо его отредактировать, и изменить какое-то свойство, отвечающее за infinite loop.
Если что, это не имеет отношение к вебу: http://stackoverflow.com/questions/6354618/gif-image-repeat-play-in-html

Неизвестный

28.02.2012, 11:22

общий

Добрый день. Распаковал хелп файл с помощью Тотал Коммандера и действительно не нашел ни файла grass000.jpg ни других фалов которые используются в оформлении.

с чем это может быть связано? как это исправить?

давно

Асмик Гаряка

Профессор
230118
3054

28.02.2012, 11:24

общий

Добавьте невидимый div с картинкой и снова скомпилируйте.

Неизвестный

28.02.2012, 11:37

общий

Адресаты:

к сожалению я не понимаю что такое невидимый div с картинкой и как это сделать. с div раньше не работал, а этот код как я и говорил скопировал с сайта-источника. Вы можете написать что конкретно нужно поменять в строках ? в приложении я описывал используемый код[/q]

Неизвестный

28.02.2012, 11:52

общий

28.02.2012, 11:54

Возможно проблема в том, что в момент компиляции хелпа, в файле hhp нет упоминания о том, что вам нужна картинка, и соответственно она в финальный хелп не копируется. Вероятно, это связано с CSS стилями для только для body тега.

Про div тэг, вы можете написать следующий код:

[code lang=html]<div class="myDiv"> </div>[/code]

[code lang=css].myDiv {
background-image: ... ту же картинку
display: none;
visibility: hidden;
}[/code]

может быть сборщик хелпа увидит ссылку на картинку и подгрузит её туда.

а так, судя по тредам:
http://tech.groups.yahoo.com/group/dita-users/message/13508
http://lists.oasis-open.org/archives/docbook-apps/200909/msg00082.html

вы можете добавить вашу картинку в итоговый CHM файл принудительно

давно

Асмик Гаряка

Профессор
230118
3054

28.02.2012, 12:35

общий

это ответ

Здравствуйте, Dextrous!

Формат файла *.chm довольно старый. Неудивительно, что в нем плохо поддерживаются таблицы стилей. Картинки не были добавлены в Ваш файл, поэтому опишите их явно в секции [Files] файла *.hhp.

Код:

[Files]
имякартинки.gif

Также Вы можете вставить картинку в html код, сделав ее невидимой.

Код:

Код (HTML):

    <div class="myDiv"> </div>

Код (CSS):

Код:


    .myDiv {
    background-image: ... ту же картинку
    display: none;
    visibility: hidden;
    }

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

Неизвестный

28.02.2012, 14:06

общий

Адресаты:

Отлично! добавил файлы принудительно в .hhp теперь все отображается. но столкнулся с другой проблемой. в Google Chrome все ровно отображается, но если открыть в Internet Explorer то отображается вот так: http://s017.radikal.ru/i422/1202/84/45eed0b78891.jpg
Кстати и в компилированном хелпе точно так же криво. какой параметр может это исправить? что подредактировать нужно ?

давно

Асмик Гаряка

Профессор
230118
3054

28.02.2012, 14:12

общий

Что именно криво?

Неизвестный

28.02.2012, 14:15

общий

шар встает правильно в своем положении. а вот bg_top00.jpg почему то не полностью отображается. и шар почему то на текст находит, хотя текст по идее должен быть ниже - после картинок

Прикрепленные файлы:

9eb049a7c129772c22a6551590197f0c.png

скачать (476.00 кБ)

Неизвестный

28.02.2012, 14:16

общий

примерно должно получаться вот так

Прикрепленные файлы:

02c4f321afc00c2c7e9b4fa8088d155c.png

скачать (659.00 кБ)

Неизвестный

28.02.2012, 14:24

общий

К сожалению, не знаю где ваша разметка, но все похоже на то, что вы с помощью абсолютного позиционирования и z-index правил добились того, что ваш мяч вышел из занимаемого контейнера и перекрыл собой текст.
можете попробовать решение "влоб" и сверстать главную страницу на таблицах, а не на дивах. Это должно помочь сделать страницу одинаково выглядевшей в разных браузерах.

Неизвестный

28.02.2012, 14:38

общий

Вы уважаемые эксперты помогли мне в первоначальном вопросе. Спасибо огромное. Но я не настолько хорошо владею знаниями по HTML.

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

Неизвестный

28.02.2012, 14:46

общий

Да я могу попробовать помочь вам здесь, но не обещаю, что прямо сейчас смогу, ибо на работе я и сижу здесь просто так :)
Если можете, приложите пожалуйста HTML код, CSS файл и картинки, которые вы открываете в IE и они отображаются криво. Я дома поковыряю, может быть смогу помочь вам.
Ну или, если хотите, создайте новый вопрос, может быть вам помогут быстрей и наглядней.

Неизвестный

28.02.2012, 15:24

общий

Буду благодарен Вам за помощь.

Прикрепленные файлы:

a31035719b819045ac091b534393f8f3.rar

скачать (1.22 МБ)

Неизвестный

28.02.2012, 15:51

общий

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

Не судите строго, но по умолчанию мой ИЕ9 открывает его в Quirk Mode (F12), что означает, что браузер не поймет как отображать код и отображает его кое-как. Кстати это "кое-как" хорошо выглядит в ФФ (увы, хрома у меня тут нет).

Я немного подправил ваш код, но скажу, что он не 100% красивый, так как делал это быстро (там много переделывать), но во всяком случае, задачу решил.

Итак мои изменения:
1. Я удалил пару тегов, которые не закрывались должным образом (body and head).
2. также hr был переименован в div
3. так как ваш код не следует определенному стандарту, то я выбрал html 4.01 как самый хороший среди плохих. но советую вам почитать что-нибудь про DOCTYPE, XHTML 1.0 Strict/Transitional or HTML 5
4. табличке я добавил margin-left and right в CSS стилях, чтобы в ИЕ8 она выровнялась по ширине.

Короче, мой код проходит валидацию с 9ю ошибками

( http://validator.w3.org/#validate_by_input ), но надо чтобы их там было ноль.

посмотрите мой аттач, надеюсь у вас заработает так как надо.

Прикрепленные файлы:

3f43cbf98f53a7b8ebc3ced1430c069c.zip

скачать (647.00 кБ)

давно

Асмик Гаряка

Профессор
230118
3054

28.02.2012, 16:53

общий

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

давно

Асмик Гаряка

Профессор
230118
3054

28.02.2012, 16:59

общий

Знакомы с интернет-университетом? Там есть хорошие курсы, если надо подучить hmtl
http://www.intuit.ru/department/internet/vinhtmlcss/

Неизвестный

28.02.2012, 21:21

общий

Спасибо огромное

Теперь все хорошо работает и отображается. И в Explorer тоже. Остальное смогу подправить. Я Вам очень благодарен. Ваш ответ лучший ))) 5 баллов

Неизвестный

28.02.2012, 21:30

общий

28.02.2012, 21:34

да не за что, удачи вам, надеюсь вам удалось сэкономить два евро :))
Кстати, советую уделить внимание вебу в целом, если хотите добиться успеха.

обязательно советую вам поизучать эту тему:
link1
link2

надеюсь осилите. ну и веб подучите

Неизвестный

28.02.2012, 21:46

общий

Спасибо ))) еще раз! сейчас и ссылочки изучим

давно

Асмик Гаряка

Профессор
230118
3054

29.02.2012, 13:15

общий

На будущее: вместо радикала файлы можно хранить и на здешнем сервере https://rfpro.ru/upload. То, что используется в ответе, здесь точно будет храниться, а с других сайтов исчезнет.

Форма ответа

Отправка постов/ответов доступна только зарегистрированным и подтвержденным пользователям.

Если Вы уже зарегистрированы на Портале - войдите в систему, если Вы еще не регистрировались - пройдите простую процедуру регистрации.