Bine ai venit pe DesignART !
-Forumul DesignART ofera servicii gratuite in domeniile Graphic Design si Coding !
-Pentru a beneficia de aceste servicii trebuie doar sa va INREGISTRATI si/sau sa va CONECTATI
-Innainte de a incepe sa postati,va sfatuim sa cititi REGULAMENTUL forumului !


Alăturați-vă forumului, este rapid și ușor

Bine ai venit pe DesignART !
-Forumul DesignART ofera servicii gratuite in domeniile Graphic Design si Coding !
-Pentru a beneficia de aceste servicii trebuie doar sa va INREGISTRATI si/sau sa va CONECTATI
-Innainte de a incepe sa postati,va sfatuim sa cititi REGULAMENTUL forumului !
Doriți să reacționați la acest mesaj? Creați un cont în câteva clickuri sau conectați-vă pentru a continua.

Tutorial Sexy Slider

5 participanți

 :: DesignART - Resurse :: Tutoriale :: Tutoriale Css, Html si JavaScript

In jos

Tutorial Sexy Slider Empty Tutorial Sexy Slider

Mesaj Scris de Edge Sam Sept 17, 2011 7:40 am

Tutorial - Sexy Slider

Pentru a pune în aplicare acest script nu aveţi nevoie de nici o experienţă jQuery. Urmati pasii urmatori:

1. Creeati o noua pagina HTML si adaugati codurile urmatoare:
Cod:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="http://designbook.bravehost.com/SlideShow-Top.js">

/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library ([Trebuie sa fiti inscris si conectat pentru a vedea acest link]
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
* Slideshow edited for [Trebuie sa fiti inscris si conectat pentru a vedea acest link]
***********************************************/

</script>

<script type="text/javascript">

var mygallery2=new fadeSlideShow({
   wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
   dimensions: [440, 140], //width/height of gallery in pixels. Should reflect dimensions of largest image
   imagearray: [
      ["http://i39.servimg.com/u/f39/15/69/94/13/green10.png", "#", "_new", "De completat"],
      ["http://i39.servimg.com/u/f39/15/69/94/13/green10.png", "#", "_new", "De completat"],
            ["http://i39.servimg.com/u/f39/15/69/94/13/green10.png", "#", "_new", "De completat"],
            ["http://i39.servimg.com/u/f39/15/69/94/13/green10.png", "#", "_new", "De completat"],//<--no trailing comma after very last image element!
   ],
   displaymode: {type:'manual', pause:2500, cycles:0, wraparound:false},
   persist: false, //remember last viewed slide and recall within same session?
   fadeduration: 500, //transition duration (milliseconds)
   descreveal: "always",
   togglerid: "fadeshow2toggler"
})

</script><div class="slideshow-box"><div id="fadeshow2"></div></div><div id="fadeshow2toggler" style="width:350px; text-align:center; margin-top:10px"><div class="slideshow-button-1"><a href="#" class="prev"><img src="http://i39.servimg.com/u/f39/15/69/94/13/round_11.png" style="border-width:0" /></a></div>  <div class="slideshow-status"><span class="status" style=" font-weight:bold"></span></div> <div class="slideshow-button-2"><a href="#" class="next"><img src="http://i39.servimg.com/u/f39/15/69/94/13/round_10.png" style="border-width:0" /></a></div>
</div><div id="fadeshow2"></div>

2. Adaugam codul urmator intre tag-ul: < style > si < /style >

Cod:
<style>
/*-----Sexy Slider - [Trebuie sa fiti inscris si conectat pentru a vedea acest link] -------*/
.slideshow-box {
            position:absolute;
            top:110px;
            margin-left:385px;
border:4px solid #000;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
-moz-box-shadow: 0 0 18px #888;
-webkit-box-shadow: 0 0 18px#888;
box-shadow: 0 0 18px #888;
}

.slideshow-button-1 {
            position:absolute;
            top:260px;
            margin-left:390px;
}

.slideshow-button-2 {
            position:absolute;
            top:260px;
            margin-left:780px;
}

.slideshow-status {
            position:absolute;
            top:275px;
            margin-left:590px;
}</style>

3. Daca ati urmarit corect pasii de m-ai sus veti avea propriul slider !


- Pentru orice nelamurire legata de acest tutorial va rugam sa postati
in sectiunea [Trebuie sa fiti inscris si conectat pentru a vedea acest link]

Tutorial realizat de ------ | DesignART

***Important !
Reproducerea si/sau copierea acestui tutorial NU este permisa fara acordul postatorului !










avatar
Edge
Administrator
Administrator

Mesaje Mesaje : 528
Credite Credite : 702
Reputatie : 3
Varsta Varsta : 28
Localizare Localizare : Resita

https://designart.catsboard.com/

Sus In jos

Tutorial Sexy Slider Empty Re: Tutorial Sexy Slider

Mesaj Scris de denisdeni22 Vin Sept 23, 2011 3:58 am

foarte bun tutorial...multumim edge Razz
denisdeni22
denisdeni22
Membru DesignART
Membru DesignART

Mesaje Mesaje : 98
Credite Credite : 36
Reputatie : 3
Varsta Varsta : 28
Localizare Localizare : Pascani

http://junktutorials.wikiforum.ro/

Sus In jos

Tutorial Sexy Slider Empty Re: Tutorial Sexy Slider

Mesaj Scris de Kocos Vin Sept 23, 2011 6:16 am

Mie nu imi merge nu stiu de ce Sad
Kocos
Kocos
Gold Member
Gold Member

Mesaje Mesaje : 354
Credite Credite : 166
Reputatie : 3
Varsta Varsta : 28
Localizare Localizare : Arad

http://proaim.wow3.info

Sus In jos

Tutorial Sexy Slider Empty Re: Tutorial Sexy Slider

Mesaj Scris de slosii Vin Sept 23, 2011 8:01 am

el a gresit,a uitat sa scoate /
incearca asta:
Cod:
<style>
/*-----Sexy Slider - [Trebuie sa fiti inscris si conectat pentru a vedea acest link] -------*/
.slideshow-box {
            position:absolute;
            top:110px;
            margin-left:385px;
border:4px solid #000;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
-moz-box-shadow: 0 0 18px #888;
-webkit-box-shadow: 0 0 18px#888;
box-shadow: 0 0 18px #888;
}

.slideshow-button-1 {
            position:absolute;
            top:260px;
            margin-left:390px;
}

.slideshow-button-2 {
            position:absolute;
            top:260px;
            margin-left:780px;
}

.slideshow-status {
            position:absolute;
            top:275px;
            margin-left:590px;
}</style>
slosii
slosii
Membru DesignART
Membru DesignART

Mesaje Mesaje : 51
Credite Credite : 157
Reputatie : 0
Varsta Varsta : 29

http://raiiteam.forumclan.com/

Sus In jos

Tutorial Sexy Slider Empty Re: Tutorial Sexy Slider

Mesaj Scris de Kocos Vin Sept 23, 2011 9:35 am

@slosii , multumesc mult ca m-ai ajutat si de data aceasta Smile

@Edge , arata foarte bine ! Buna treaba Smile
Kocos
Kocos
Gold Member
Gold Member

Mesaje Mesaje : 354
Credite Credite : 166
Reputatie : 3
Varsta Varsta : 28
Localizare Localizare : Arad

http://proaim.wow3.info

Sus In jos

Tutorial Sexy Slider Empty Re: Tutorial Sexy Slider

Mesaj Scris de Gabryel Mier Oct 19, 2011 2:05 pm

multumesc foarte mult pentru acest cod
Gabryel
Gabryel
Gold Member
Gold Member

Mesaje Mesaje : 101
Credite Credite : 106
Reputatie : 0
Localizare Localizare : MUIE DESIGNART!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

http://MUIEDESIGNRT.FORUMHIT.RO

Sus In jos

Sus

- Subiecte similare

 :: DesignART - Resurse :: Tutoriale :: Tutoriale Css, Html si JavaScript

 
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum