1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

Ajuda em HTML/Javascript

Discussão em 'Programação' iniciada por _Nikon_, 18 de Junho de 2006. (Respostas: 30; Visualizações: 1966)

  1. _Nikon_

    _Nikon_ Whole lotta BOINC

    Ajudem aqui um 'cromo da bola'.

    Eu queria fazer um site para mostrar as fotos de um festival que houve na minha terra. E queria fazer de maneira a que ao carregar em seguinte ou anterior o url da imagem mudasse e a imagem se alterasse sozinha. O problema é que não sei como se faz. Estive a espreitar uns códigos de sites com métodos iguais mas há coisas que estão omitidas ou em outros ficheiros externos ao código e não dá para entender tudo.

    O que queria saber era o que fazer para arranjar uma maneira de, por exemplo, ao carregar em "próxima", o url da imagem - imaginemos www.blablabla.com/img1.jpg - mudasse para www.blablabla.com/img2.jpg e assim alterasse a imagem.

    Como faço para mexer no url e alterá-lo 'on the fly'?

    Já agora, e como curiosidade, se me ensinassem a fazer uma zona para deixar comentários individuais para cada imagem também era bom porque o guestbook do SAPO........

    EDIT: Tenho a leve impressão que não era bem aqui que devia ter posto isto. :D
     
    Última edição: 23 de Junho de 2006
  2. Fric

    Fric Power Member

    Se quiseres uma maneira facil criar um html para cada imagem, algo do tipo.

    pic1.html
    pic2.html
    pic3.html

    Depois, dentro de cada html, crias referencias para o proximo e anterior.
    Por exemplo, no pic2.html crias referencia no link anterior para o pic1.html e no proximo para o pic3.html


    Quanto aos comentarios... penso q seja necessário criar uma ligacao com uma base de dados para eles ficarem registados.

    Fica bem
     
  3. _Nikon_

    _Nikon_ Whole lotta BOINC

    Isso é precisamente o que não quero fazer. Porque não é uma ou duas imagens mas sim dezenas delas. Teria de criar dezenas de páginas.
     
  4. Fric

    Fric Power Member

    Cria um fotoblog
     
  5. _Nikon_

    _Nikon_ Whole lotta BOINC

    Se é para dizer isso mais vale nem responderes...

    EDIT: Já agora. Queria fazer de maneira a que as miniaturas das imagens (que serão a anterior e a próxima. Apenas uso esta para testar) tivessem por baixo delas o texto "anterior" e "próxima". Até aqui tudo bem e não haveria problema se ao tentar por o texto por baixo, a imagem com o tamanho grande não descesse também.

    Passa disto para isto ou isto na melhor das hipóteses. Como faço para deixar tudo centrado e com o texto por baixo das miniaturas? Também reparei agora que as miniaturas não estão alinhadas na vertical com o centro da imagem grande mas sim um pouco acima. Mais uma dúvida. :D
     
    Última edição: 18 de Junho de 2006
  6. Fric

    Fric Power Member

    Pobre e mal agradecido ainda por cima...

    Ta descansado q n ponho aqui mais nenhum post... fica la com a tua thread q certamente teras muitas ajudas...

    Fica bem
     
  7. _Nikon_

    _Nikon_ Whole lotta BOINC

    Pobre e mal agradecido? Se quisesse fazer um fotoblog fazia um mas eu disse que quero fazer um SITE. Aqui falasse de html e javascript. Se não sabes não me digas para fazer outra coisa qualquer. Isto é com cada uma...
     
  8. Se o problema é teres de fazer as dezenas de páginas, porque não usas uma ferramenta de geração automatica de albuns?...eu uso o "Web Album generator" (acho que o nome é este). Ele gera as dezenas de paginas e se houver algo que nao gosto edito-as...sempre custa menos do que faze-las todas. Mas também podes fazer uma, usar o copy paste e depois alterares apenas os links (se bem que dá mais trabalho que o gerador automatico :) )
     
  9. PHaRGoTH

    PHaRGoTH Power Member

    Última edição: 18 de Junho de 2006
  10. _Nikon_

    _Nikon_ Whole lotta BOINC

    Precisamente. A parte do aspecto já é problema meu mas já é fácil. E quanto àquilo do texto e das miniaturas? Não sabes como resolver isso. Também não sei se me expliquei bem...

    EDIT: Já está feito. Agora só falta definir as imagens das miniaturas e meter o tal texto...

    Na amostragem das imagens tenho assim:

    Código:
    <script>
    document.write('<a href="#" onClick="backward();return false"><img src="'+photos[which-1]+'" name="photoslider" style="border-color: white" align="middle" width="100" height="75" border="10"></a>')
    document.write('<img src="'+photos[0]+'" name="photoslider" style="border-color: white" align="middle" width="640" height="480" border="10">')
    document.write('<a href="#" onClick="forward();return false"><img src="'+photos[which+1]+'" name="photoslider" style="border-color: white" align="middle" width="100" height="75" border="10"></a>')
    </script>
    Mas assim apenas muda a imagem do primeiro bloco 'document.write'. Como faço para mudar também os outros dois? O primeiro bloco corresponde à miniatura da imagem anterior, o segundo da imagem actual (e mostrada grande portanto) e o terceiro da miniatura da imagem seguinte.
     
    Última edição: 19 de Junho de 2006
  11. lfdesign

    lfdesign Power Member

    Podias criar um slideshow em flash... Há dezenas de tutorials sobre como fazer isso...

    Além de que iria ficar de certeza com muito melhor aspecto...
     
  12. iznougud

    iznougud I quit My Job for Folding

    O melhor é fazeres isso em ASP ou PHP e de preferencia com um abase de dados. Pelo que percebi não sabes nenhuma destas, mas não é dificil aprenderes a fazer isso e depois nao vais querer outra coisa.
     
  13. _Nikon_

    _Nikon_ Whole lotta BOINC

    Mas o tempo de aprender nem que seja o mínimo indispensável é muito tempo perdido. Quero ter isto pronto no máximo amanhã. Hoje já tenho as fotos e são à volta de 60 fotos. Da maneira que está agora apenas tenho de introduzir os links no array o resto é feito sozinho.
     
    Última edição: 19 de Junho de 2006
  14. _Nikon_

    _Nikon_ Whole lotta BOINC

    Já resolvi todas as minhas dúvidas. Algumas eram apenas problemas de código que dizia para não alterar (naquele link que o PHaRGoTH deu) mas era preciso alterar. Agora a única dúvida está em como pôr o texto "anterior" e "próxima" por baixo das respectivas imagens miniaturas. De momento o site tem as miniaturas com o texto ao lado e por cima da imagem maior mas queria pôr tanto o texto como as miniaturas cada uma de cada lado da imagem grande para poupar espaço vertical e como o horizontal chega e sobra... (isto para 1024x768). Para uma melhor compreensão do problema vejam o site em http://feiradavinhaedovinho.com.sapo.pt/. Tem as miniaturas em cima com o texto ao lado e quero por o texto e a respectiva miniatura ao lado da imagem grande.
     
  15. Lagaffe

    Lagaffe Power Member

    Uma maneira muito fácil e sem grande trabalho é usares uma ferramenta do frontpage, que é o esquema de apresentação de diapositivos. Cria-te todo o slideshow em segundos. Só tens que seleccionar as fotos.
    É claro que não aprendes como é que se faz, mas ficas com o problema resolvido.
     
    Última edição: 19 de Junho de 2006
  16. _Nikon_

    _Nikon_ Whole lotta BOINC

    Mas a questão aqui é aprender como se faz... eu já disse que aqui o problema é HTML/Javascript.
     
  17. PHaRGoTH

    PHaRGoTH Power Member


    bom antes demais conselho, quando fizeres paginas optimiza para 800 X 600, por qualquer razão pode haver utilizadores que nao queiram, ou nao possam ver uma pagina tão "grande".

    quanto a tua duvida, bem não estou bem a perceber o problema. Vamos recapitular:

    queres ter uma miniatura da imagem anterior a que esta maximizada (do lado esquerdo desta ultima), do lado direito uma miniatura da imagem seguinte. e queres que por baixo das miniaturas esteja ANTERIOR (na miniatura da imagem anterior) e SEGUINTE(na miniatura da imagem seguinte).

    mas tas com problemas em colocar esses "links". é isso??

    bem se for esse o caso, acho que seja um problema na implementação da table de HTML.

    Se nao tem nada a ver com isto desculpa nao leves a mal, mas é qeu nao estou a perceber mesmo.

    :S
     
  18. _Nikon_

    _Nikon_ Whole lotta BOINC

    O problema não é em colocar os destinos dos links (se percebi que era essa a dúvida da dúvida) mas sim em colocar o texto por baixo da imagem sem afectar o posicionamento dos resto dos componentes da página. Quanto à resolução, mais tarde ponho o tamanho conforme a resolução do monitor. Já vi uns scripts para fazer isso algures...

     
    Última edição: 19 de Junho de 2006
  19. PHaRGoTH

    PHaRGoTH Power Member


    entao o teu problema é memso o tabelamento da página.

    Uma tabela com duas linhas e 3 colunas, e na coluna do meio fazes merge ficando essa coluna com uma unica linha.

    em seguida nas outras coluna na celula de cima colocas a imagem e na debaixo a palavra, ou o contrario conforme preferires..

    ficas ocm qq coisa do genero


    imageAnt IMAGEM ImageSeg
    anterior MAXIMIZADA seguinte

    Bom, agora vou ter de sair, mas de quiseres mais tarde posso dar-te o codigo HTML dessa table.
     
  20. _Nikon_

    _Nikon_ Whole lotta BOINC

    Penso que consigo fazer sem problemas mas no entanto mais tarde coloco aqui o código para optimização se não te importares.
     

Partilhar esta Página