wmmail.ru – cервис почтовых рассылок на главную
написать письмо
карта сайта

С чего начать?РекламодательПравилаFAQСтатистикаБиржа статейTOP100ФоткиКонтакты
Логин:
Пароль: 
Регистрация   Забыли пароль?
WMLogin
Пользователей всего:

542590

Пользователей сегодня:

80

Пользователей online:

163

Выплачено ($): 7`602`660,56
Выплат: 8`111`837
Писем прочитано: 1`024`932`706

 
 
Online 0
Все ответы
 
 

Вопрос #75198

Внимание! В разделе вопрос-ответ запрещается:

  • Мат, оскорбления, флуд, реклама
  • Сообщения, не являющиеся вопросами/ответами
  • Нарушение законодательства РФ
  • Попрошайничество в любой форме

Выделите текст и нажмите для цитирования  #  
0   [11.12.2017 04:57] #2916211

Закрытый вопрос от пользователя Наложить текст на картинку

Нужно наложить текст на картинку, картинка - анонс статьи не находится в блоке div, собственно в этом и загвоздка. Позиционирование картинки зависит от разрешения экрана и других картинок. Возможно как-то наложить текст на картинку не помещая ее в блок посредством хтмл цсс? Гениальную идею написать надпись в фоторедакторе не предлагать, сам так делаю.
Раздел: Дизайн, Верстка, последний комментарий: 13.12.2017 20:06
Вопрос закрыт пользователем Al-Yena

Ответы
Ответов всего: 14  вопрос закрыт 
Выделите текст и нажмите для цитирования  #  
+1   [12.12.2017 00:04] #1257597   Все ответы пользователя

Я не понял суть вопроса. Может это подойдёт http://shpargalkablog.ru/2011/04/css-nalozhenie.html.

А можно сделать и по сложнее:
Динамическое создание изображений средствами php http://img.ii4.ru/images/2017/12/11/905540_kiss_213kb.jpg
В скрипте php загружаем изображение (подложку), а на него наносим текст и преобразовываем в картинку. Далее картинку размещаем на сайте в том месте где захотите.

Вот пример картинки (подложки) с нанесением текста (счётчика посещений) http://www.wmmail.ru/index.php?cf=journal-viewljsays&jid=25181

А вот пример как вставить такую картинку на сайт
http://plnkr.co/edit/756pMXUbriDsZWqfAOgw?p=preview
Кстати попробуйте её ради интереса сохранить http://img.ii4.ru/images/2017/12/12/905561_kiss_162kb.jpg
......

Дальше о грустном. Нужно поседеть пару дней и разобраться с php как это всё делается. Нужно использовать сайт с поддержкой php и не помню ещё с какой то функцией. Типа поддержка Динамическое создание изображений. На платных доменах это должно быть. Я помочь не могу, у меня нет такого сайта для тестировки.
Ищите в гугле: счетчики динамическое создание изображений средствами php. Правда там разобраться сложновато. Можно найти какой то готовый пример.
Проголосовали: #2916211
Выделите текст и нажмите для цитирования  #  
0   [12.12.2017 00:54] #3587657   Все ответы пользователя

На JS это можно решить, только как - не знаю. Ибо нуб в теме. =):cool:
п.с. Какой-нить фреймворк наверняка есть, где подобная ерунда в два счета делается...:angel:
Выделите текст и нажмите для цитирования  #  
0   [12.12.2017 03:35] #2916211   Все ответы пользователя

#1257597 пишет Я не понял суть вопроса.

Наложить текст поверх картинки раз плюнуть, если поместить картинку в div. Вот только помещение в блок лишает картинку адаптивности http://www.ii4.ru/image-905623.html
http://www.ii4.ru/image-905624.html
http://www.ii4.ru/image-905625.html
Пхп не пойдет
:rolleyes:

Добавлено спустя 02 минуты 52 секунды
#3587657 пишет На JS это можно решить, только как - не знаю. Ибо нуб в теме.

Ох уж эти нубы, им лишь бы в JS что-нибудь запихнуть:xmas:
Выделите текст и нажмите для цитирования  #  
0   [12.12.2017 10:36] #3587657   Все ответы пользователя

#2916211 пишет Наложить текст поверх картинки раз плюнуть, если поместить картинку в div.

#2916211 пишет анонс статьи не находится в блоке div, собственно в этом и загвоздка.

#2916211 пишет Возможно как-то наложить текст на картинку не помещая ее в блок

...:lol:
Выделите текст и нажмите для цитирования  #  
+1   [12.12.2017 15:54] #1257597   Все ответы пользователя

Так а первый вариант http://shpargalkablog.ru/2011/04/css-nalozhenie.html. Не подходит... ?
Проголосовали: #2916211
Выделите текст и нажмите для цитирования  #  
0   [12.12.2017 17:45] #2916211   Все ответы пользователя

#1257597 пишет Так а первый вариант http://shpargalkablog.ru/2011/04/css-nalozhenie.html. Не подходит... ?

да не буду я его в блок помещать, пропадает адаптивность под разные разрешения и появляется куча дополнительного гемора. Если нет способа без тега div, то буду и дальше писать на картинке в паинте, пока накат не появится весь код страницы переделать, а может к тому времени и пхп освою:xmas:
Выделите текст и нажмите для цитирования  #  
+1   [12.12.2017 19:25] Revos Рейтинг 543.73     Стена пользователя Revos +42  Все ответы пользователя Revos

У вас картинки обернуты в ссылки, не морочьте голову:
https://i.snag.gy/1GY8xZ.jpg
Проголосовали: #2916211
Выделите текст и нажмите для цитирования  #  
0   [12.12.2017 19:43] #2916211   Все ответы пользователя

Revos пишет
У вас картинки обернуты в ссылки, не морочьте голову

Ну и? А текст как вывести? Кумекаю над вашим скрином и пока не одуплил.
Выделите текст и нажмите для цитирования  #  
+1   [12.12.2017 19:48] #1257597   Все ответы пользователя

А на JavaScript не пойдёт?
Можно картинку помещать в канвас, а на неё текст http://plnkr.co/edit/i8Qbjj4M1fNkSpCQUYwD?p=preview
Открой скрипт http://img.ii4.ru/images/2017/12/12/905987_kiss_174kb.jpg

Не много справки http://html5ru.com/api-canvas-xolst-kratkij-spravochnik.html только там в текстах полно ошибок.

Лучше по гуглить: js canvas
Проголосовали: #2916211
Выделите текст и нажмите для цитирования  #  
+1   [12.12.2017 20:01] #2916211   Все ответы пользователя

Revos пишет не морочьте голову

Вот огромное спасибо, разобрался, проверил - все пучечком. А в интернетах во всех примерах про div, видимо не там искал. А все гениальное просто!
:hands:
Я ведь веб дизайн своебразно осваиваю - кусок кода с примера вставлю, работает, а как работает не всегда понимаю.
Проголосовали: #1257597
Выделите текст и нажмите для цитирования  #  
0   [12.12.2017 20:42] Revos Рейтинг 543.73     Стена пользователя Revos +42  Все ответы пользователя Revos

#2916211 пишет А в интернетах во всех примерах про div, видимо не там искал. А все гениальное просто!

Можно и с дивом, получится одно и то же.
https://i.snag.gy/xtzwjW.jpg

#2916211 пишет Я ведь веб дизайн своебразно осваиваю - кусок кода с примера вставлю, работает, а как работает не всегда понимаю.

Нормально верстать таким образом вы никогда не научитесь.
Выделите текст и нажмите для цитирования  #  
0   [13.12.2017 04:15] #2916211   Все ответы пользователя

Тут выяснилось следующее: пока картинки в 1 ряд все пучком, как в несколько рядов - надписи уплывают
http://pixs.ru/showimage/opaJPG_6687324_28640482.jpg
как можно это исправить?
Выделите текст и нажмите для цитирования  #  
+1   [13.12.2017 19:56] Revos Рейтинг 543.73     Стена пользователя Revos +42  Все ответы пользователя Revos

#2916211 пишет как можно это исправить?

это я тупанул: https://i.snag.gy/sVYxgy.jpg
Проголосовали: #2916211
Выделите текст и нажмите для цитирования  #  
0   [13.12.2017 20:06] #2916211   Все ответы пользователя

Revos пишет это я тупанул: https://i.snag.gy/sVYxgy.jpg

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

Видеоурок

Вопрос-ответ

НОВОСТИ
21.02.2024QIWI
подробнее>>
31.12.2023С Новым 2024 Годом!
подробнее>>

© 2004-2024 «WMMAIL» Пользовательское соглашение