Title

From c6039356737705b4a12ecfb3ca30938bbcda51f3 Mon Sep 17 00:00:00 2001 From: nael Date: Wed, 17 Oct 2018 18:02:39 +0200 Subject: [PATCH] fix #1982 @21 --- Slideshow-RSS/index.html | 10 +++++ Slideshow-RSS/main.js | 32 +++++++++++----- Slideshow-RSS/style.css | 82 ++++++++++++++++++++++++++++++++++++++++ 3 files changed, 114 insertions(+), 10 deletions(-) create mode 100644 Slideshow-RSS/style.css diff --git a/Slideshow-RSS/index.html b/Slideshow-RSS/index.html index 7a240d6..6ea52e1 100644 --- a/Slideshow-RSS/index.html +++ b/Slideshow-RSS/index.html @@ -1,12 +1,22 @@ + + Title + +

+ En savoir plus +

diff --git a/Slideshow-RSS/main.js b/Slideshow-RSS/main.js index 8c63857..2206140 100644 --- a/Slideshow-RSS/main.js +++ b/Slideshow-RSS/main.js @@ -5,7 +5,7 @@ $(document).ready(function () { url: 'rss.xml', dataType: 'text', success: function (data) { - //console.log(data); + var xmlDoc = $.parseXML(data), $xml = $(xmlDoc); @@ -15,20 +15,32 @@ $(document).ready(function () { var description_text= desc_jquery.text(); var img = $(desc_jquery).find('img').attr('src'); - var div = ('

'+ - '

'+ - description_text - +'

' + - '

' - +'

' + - '

'); + var div = $('

'+ + '

' + + '

'+ + description_text + +'

' + + '

'); + $(div).find(".image").css("background-image","url("+img+")"); $('#container').append(div); + $( '.item' ).addClass("hidden"); + }); + var slideItem = $(".item"), + slidelength = slideItem.length , + count = -1; + function goNextSlide(){ + $(slideItem).addClass('hidden').removeClass('fadeIN'); + $(slideItem).eq((++count)%slidelength).removeClass('hidden').addClass('fadeIN'); + } + goNextSlide(); + setInterval(goNextSlide, 4000 ); } + }); -}); \ No newline at end of file +}); + diff --git a/Slideshow-RSS/style.css b/Slideshow-RSS/style.css new file mode 100644 index 0000000..b837c0f --- /dev/null +++ b/Slideshow-RSS/style.css @@ -0,0 +1,82 @@ +*{ + padding: 0px; + margin: 0px; +} +#canvas{ + width: 350px; + height: 470px; + position: absolute; + display: none; +} +@font-face { + font-family: "typo" ; + src: url("roboto.woff") format('woff'); +} + +#container{ + width: 350px; + height: 470px; + background-color: white; +} +.item{ + text-align: center; + position: relative; + +} +.description{ + text-align: left; + width: 280px; + height: 45px; + padding: 0px 32px; + margin-top: 50px; + line-height: 1.33; + overflow: hidden; + text-overflow: ellipsis; + font-family: typo; + font-size: 17px; + color: #3d3d3d; +} +.image{ + height: 300px; + width: 280px; + background-size: contain; + background-repeat: no-repeat; + background-position: center; + position: relative; + top: 25px; + left: 31px; +} +.pinterest{ + width: calc(350px - 60px); + padding: 0px 30px; + position: fixed; + top: 420px; + display: flex; + align-items: center; + pointer-events: none; +} +.logo{ + width: 20px; + margin-right: 10px; +} +.more{ + font-family: typo; + font-size: 16px; + color: #3d3d3d; +} +.fadeIN{ + -webkit-animation: fadein 0.5s; /* Safari, Chrome and Opera > 12.1 */ + -moz-animation: fadein 0.5s; /* Firefox < 16 */ + -ms-animation: fadein 0.5s; /* Internet Explorer */ + -o-animation: fadein 0.5s; /* Opera < 12.1 */ + animation: fadein 0.5s; + display: block; +} +@keyframes fadein { + from { opacity: 0; } + to { opacity: 1; } +} + +.hidden{ + display: none; +} \ No newline at end of file -- 2.39.5